:root{--trm-navy:#071a33;--trm-cyan:#09c7eb;--trm-ink:#10233c;--trm-muted:#6a7c91;--trm-line:#dfe8ef;--trm-surface:#f2f6f9;--trm-safe-top:env(safe-area-inset-top,0px);--trm-safe-right:env(safe-area-inset-right,0px);--trm-safe-bottom:env(safe-area-inset-bottom,0px);--trm-safe-left:env(safe-area-inset-left,0px)}
.tr-native-app #tr-employee-call-log>.tr-portal-call-filters{display:none!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta{display:flex!important;grid-template-columns:none!important;gap:6px!important;overflow-x:auto!important;margin:0 -14px!important;padding:0 14px 4px!important;scrollbar-width:none}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta::-webkit-scrollbar{display:none}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta>div{display:block!important;box-sizing:border-box!important;flex:0 0 116px!important;min-width:116px!important;padding:9px 10px!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dt{display:block!important;font-size:.61rem!important;line-height:1.25!important;overflow-wrap:normal!important;word-break:normal!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dd{display:block!important;min-width:0!important;font-size:.76rem!important;line-height:1.3!important;overflow:hidden!important;text-align:left!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.tr-native-app .tr-workflow-control-grid,.tr-native-app .tr-employee-workflow-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;align-items:start!important;gap:8px!important;width:100%!important;margin:10px 0 0!important;padding:0!important}.tr-native-app .tr-workflow-control,.tr-native-app .tr-employee-workflow-actions>.tr-workflow-button,.tr-native-app .tr-employee-workflow-actions>.tr-workflow-snooze-menu>.tr-workflow-button{display:flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;width:100%!important;height:40px!important;min-height:40px!important;margin:0!important;padding:8px 10px!important;font-size:.76rem!important;line-height:1.2!important}.tr-native-app .tr-employee-workflow-actions>.tr-workflow-snooze-menu{box-sizing:border-box!important;width:100%!important;min-height:40px!important;margin:0!important}.tr-native-app .tr-workflow-control-panel,.tr-native-app .tr-workflow-snooze-options{grid-column:1/-1!important;box-sizing:border-box!important;width:100%!important}.tr-native-app .tr-workflow-control-panel[hidden]{display:none!important}.tr-native-app .tr-employee-workflow-actions+.tr-workflow-message{min-height:0!important;margin:0!important}
.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-form select,.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-form textarea{font-size:.82rem!important;line-height:1.45}.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-form textarea{min-height:96px}.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-form .tr-portal-button{min-height:42px;padding:9px 14px;font-size:.78rem}.tr-mobile-sms-message,.tr-mobile-sms-result{margin:0;padding:9px 10px;border-radius:8px;font-size:.74rem;line-height:1.4}.tr-mobile-sms-result{margin:0 0 12px}.tr-mobile-sms-message:empty{display:none}.tr-mobile-sms-message.is-success,.tr-mobile-sms-result.is-success{background:#e8f7ed;color:#216b3a}.tr-mobile-sms-message.is-error,.tr-mobile-sms-result.is-error{background:#fff0ed;color:#9a3e2b}
.tr-mobile-secure-message{display:grid;margin-top:4px;padding:11px;border:1px solid #a9e9f3;border-radius:10px;background:#eefbfe;gap:9px}.tr-mobile-secure-message p{margin:0!important;color:#415c70!important;font-size:.72rem!important;line-height:1.45!important}.tr-mobile-secure-send{box-sizing:border-box;min-height:42px;padding:9px 14px;border:0;border-radius:9px;background:var(--trm-cyan);color:#05213a;font:inherit;font-size:.78rem;font-weight:850;cursor:pointer}.tr-mobile-secure-send:disabled{opacity:.65;cursor:wait}
.tr-mobile-secure-message[hidden]{display:none!important}.tr-mobile-conversation-open{grid-column:1/-1;background:#eefafd;border-color:#9fddec;color:#086f88}.tr-mobile-conversation-open.has-unread{background:#fff1ee;border-color:#e4a095;color:#9d382a}.tr-mobile-conversation-open-body{overflow:hidden;overscroll-behavior:none}.tr-mobile-conversation-dialog{position:fixed;z-index:300;inset:0;box-sizing:border-box;padding:var(--trm-safe-top) var(--trm-safe-right) var(--trm-safe-bottom) var(--trm-safe-left);overscroll-behavior:contain;background:rgba(3,18,34,.58);backdrop-filter:blur(5px)}.tr-mobile-conversation-dialog[hidden]{display:none}.tr-mobile-conversation-sheet{display:flex;box-sizing:border-box;flex-direction:column;width:min(100%,620px);height:100%;margin:auto;overflow:hidden;overscroll-behavior:contain;border-radius:18px;background:#f4f8fb;box-shadow:0 22px 65px rgba(2,15,30,.35)}.tr-mobile-conversation-sheet>header{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;background:var(--trm-navy);color:#fff}.tr-mobile-conversation-sheet>header small{display:block;color:var(--trm-cyan);font-size:.62rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.tr-mobile-conversation-sheet>header h2{margin:3px 0 0;color:#fff;font-size:1.08rem}.tr-mobile-conversation-sheet>header button{display:grid;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font:inherit;font-size:1.5rem;place-items:center}.tr-mobile-conversation-state{margin:0;padding:10px 15px;color:#7e4134;font-size:.75rem}.tr-mobile-conversation-messages{display:flex;flex:1;flex-direction:column;gap:9px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:10px 14px 16px}.tr-mobile-conversation-message{max-width:86%;padding:10px 12px;border:1px solid #d8e4ec;border-radius:13px;background:#fff}.tr-mobile-conversation-message.is-employee{align-self:flex-end;border-color:#aee5ef;background:#eaf9fd}.tr-mobile-conversation-message small{display:block;margin-bottom:4px;color:#708196;font-size:.62rem;font-weight:800}.tr-mobile-conversation-message p{margin:0!important;color:var(--trm-ink)!important;font-size:.82rem!important;line-height:1.45!important;white-space:pre-wrap}.tr-mobile-conversation-reply{display:grid;padding:12px 14px;border-top:1px solid #d8e4ec;background:#fff;gap:8px}.tr-mobile-conversation-reply[hidden]{display:none}.tr-mobile-conversation-reply label{display:grid;color:var(--trm-ink);font-size:.72rem;font-weight:850;gap:5px}.tr-mobile-conversation-reply textarea{box-sizing:border-box;width:100%;min-height:76px;padding:10px;border:1px solid #c4d4df;border-radius:10px;font:inherit;font-size:16px;resize:vertical}.tr-mobile-conversation-reply button{min-height:43px;border:0;border-radius:10px;background:var(--trm-cyan);color:#05213a;font:inherit;font-size:.78rem;font-weight:850}.tr-mobile-conversation-reply p{min-height:1em;margin:0;color:#7e4134;font-size:.7rem}
.tr-native-app .tr-employee-call[data-tr-workflow-status="answered"]{border-left:4px solid #51b9d1}.tr-native-app .tr-employee-call[data-tr-workflow-status="answered"] .tr-mobile-workflow{border-color:#a5e8f5;background:#eefbff}.tr-native-app .tr-mobile-workflow-status-answered{background:#dff6fb;color:#0e7490}
body.tr-mobile-ready{overflow-x:hidden;background:var(--trm-surface)}
.tr-mobile-ready .tr-employee-portal{box-sizing:border-box;width:min(100%,920px);margin-inline:auto;padding:16px max(16px,var(--trm-safe-right)) max(28px,var(--trm-safe-bottom)) max(16px,var(--trm-safe-left))}
.tr-mobile-appbar{display:none}.tr-mobile-ready .tr-employee-call,.tr-mobile-ready .tr-portal-panel{overflow-wrap:anywhere}.tr-native-app .tr-mobile-app-hidden{display:none!important}
.tr-mobile-actions{display:flex;gap:10px;margin:14px 0 2px}.tr-mobile-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid #cbd9e4;border-radius:10px;background:#fff;color:var(--trm-ink);font:inherit;font-size:.86rem;font-weight:800;text-decoration:none;cursor:pointer}.tr-mobile-action-primary{border-color:var(--trm-navy);background:var(--trm-navy);color:#fff}.tr-mobile-action svg,.tr-employee-view-nav svg{width:20px;height:20px;flex:0 0 auto;fill:currentColor}.tr-mobile-action:focus-visible,.tr-mobile-ready a:focus-visible,.tr-mobile-ready button:focus-visible{outline:3px solid var(--trm-cyan);outline-offset:2px}
.tr-mobile-conversation-contact{display:grid;margin:12px 0;padding:10px 12px;border:1px solid #cfe2ea;border-radius:11px;background:#f5fafc;gap:8px}.tr-mobile-conversation-contact>div{display:grid;min-width:0;gap:2px}.tr-mobile-conversation-contact small{color:var(--trm-muted);font-size:.61rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase}.tr-mobile-conversation-contact strong,.tr-mobile-conversation-contact a{overflow-wrap:anywhere;color:var(--trm-ink);font-size:.8rem;font-weight:800}.tr-mobile-conversation-contact span{display:flex;align-items:center;justify-content:space-between;gap:8px}.tr-mobile-conversation-contact button{flex:0 0 auto;padding:5px 7px;border:1px solid #bfd4df;border-radius:7px;background:#fff;color:#31516a;font:inherit;font-size:.62rem;font-weight:800}
@media(max-width:720px){
.tr-mobile-conversation-dialog{padding:var(--trm-safe-top) var(--trm-safe-right) var(--trm-safe-bottom) var(--trm-safe-left)}
html.tr-native-shell{margin-top:0!important}html.tr-native-shell #wpadminbar,html.tr-native-shell #tawk-bubble-container,html.tr-native-shell #tawkchat-container,html.tr-native-shell iframe[src*="tawk.to"],html.tr-native-shell iframe[title="chat widget"],html.tr-native-shell .tawk-min-container{display:none!important}
body.tr-native-app{min-height:100vh;min-height:100dvh;background:var(--trm-surface)}
.tr-native-app .wp-site-blocks>.wp-block-template-part,.tr-native-app .tr-header,.tr-native-app .tr-topbar-slider-shell,.tr-native-app .tr-page-topline,.tr-native-app .tr-brand-footer,.tr-native-app footer.wp-block-template-part{display:none!important}
.tr-native-app .wp-site-blocks,.tr-native-app .tr-page-main,.tr-native-app .entry-content{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
.tr-native-app .tr-mobile-appbar{position:sticky;z-index:50;top:0;display:flex;align-items:center;justify-content:space-between;min-height:calc(62px + var(--trm-safe-top));padding:var(--trm-safe-top) max(18px,var(--trm-safe-right)) 0 max(18px,var(--trm-safe-left));border-bottom:1px solid rgba(255,255,255,.09);background:rgba(7,26,51,.97);color:#fff;box-shadow:0 8px 28px rgba(4,20,38,.16)}
.tr-mobile-appbar a{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}.tr-mobile-appbar a>span:last-child{display:grid;line-height:1.05}.tr-mobile-appbar strong{font-size:.98rem}.tr-mobile-appbar small{margin-top:4px;color:#9fb2c7;font-size:.65rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.tr-mobile-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:linear-gradient(145deg,var(--trm-cyan),#0e8fc2);color:#03213c;font-size:.72rem;font-weight:950}.tr-mobile-online{display:inline-flex;align-items:center;gap:6px;color:#b8c7d7;font-size:.7rem;font-weight:700}.tr-mobile-online i{width:7px;height:7px;border-radius:50%;background:#e0aa35;box-shadow:0 0 0 4px rgba(224,170,53,.12)}.tr-mobile-online.is-online i{background:#47dc8a;box-shadow:0 0 0 4px rgba(71,220,138,.12)}.tr-mobile-online.is-offline i{background:#e06f62;box-shadow:0 0 0 4px rgba(224,111,98,.12)}
.tr-mobile-refresh-notice{position:fixed;z-index:120;top:calc(70px + var(--trm-safe-top));left:50%;padding:9px 14px;border-radius:999px;background:var(--trm-navy);color:#fff;box-shadow:0 8px 24px rgba(7,26,51,.22);font-size:.72rem;font-weight:800;transform:translateX(-50%);white-space:nowrap}
.tr-mobile-ready .tr-employee-portal{padding:14px 14px calc(92px + var(--trm-safe-bottom))}.tr-mobile-ready .tr-portal-hero{margin:0 0 12px;padding:20px 18px;border:0;border-radius:16px;background:linear-gradient(135deg,var(--trm-navy),#123d68);box-shadow:0 14px 32px rgba(7,26,51,.15)}.tr-mobile-ready .tr-portal-hero p{margin:0 0 5px;color:var(--trm-cyan);font-size:.65rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.tr-mobile-ready .tr-portal-hero h1{margin:0;color:#fff;font-size:clamp(1.55rem,7vw,2rem);line-height:1.1;letter-spacing:-.035em}.tr-mobile-ready .tr-portal-hero span{display:block;margin-top:7px;color:#b8c9da;font-size:.83rem}
.tr-mobile-ready .tr-employee-view-nav{position:fixed;z-index:100;right:0;bottom:0;left:0;display:grid;box-sizing:border-box;grid-template-columns:repeat(5,minmax(0,1fr))!important;width:100vw;max-width:100vw!important;min-height:calc(64px + var(--trm-safe-bottom));margin:0;padding:5px max(8px,var(--trm-safe-right)) var(--trm-safe-bottom) max(8px,var(--trm-safe-left));overflow:hidden;border-top:1px solid #dce5ec;background:rgba(255,255,255,.97);box-shadow:0 -10px 32px rgba(9,31,54,.1);backdrop-filter:blur(16px)}
.tr-mobile-ready .tr-employee-view-nav a{display:flex;box-sizing:border-box;align-items:center;flex-direction:column;justify-content:center;justify-self:stretch;gap:4px;width:calc(100% - 8px);max-width:100%;min-width:0;min-height:50px;margin:0 auto;padding:3px 1px;border:0;border-radius:9px;background:transparent;color:#75869a;text-decoration:none}.tr-mobile-ready .tr-employee-view-nav a.is-active{background:#eaf9fd;color:#087d9a}.tr-mobile-ready .tr-employee-view-nav a strong{display:block;box-sizing:border-box;width:100%;min-width:0;overflow:hidden;color:inherit;font-size:.64rem;font-weight:850;text-align:center;text-overflow:ellipsis;white-space:nowrap}.tr-mobile-ready .tr-employee-view-nav a span{display:none}.tr-mobile-ready .tr-employee-view-nav svg{width:21px;height:21px}
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="opkaldslog"]{order:1}.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="beskeder"]{order:2}.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="fravaer"]{order:3}.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="hjaelp"]{order:4}.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="profil"]{order:5}
.tr-mobile-ready .tr-portal-panel{margin:12px 0;padding:18px 15px;border:1px solid var(--trm-line);border-radius:16px;background:#fff;box-shadow:0 5px 18px rgba(14,37,61,.045)}.tr-mobile-ready .tr-portal-panel-head{align-items:center;margin-bottom:14px}.tr-mobile-ready .tr-portal-panel-head h2{font-size:1.25rem;letter-spacing:-.025em}.tr-mobile-ready .tr-subscription-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tr-mobile-ready .tr-subscription-metric{min-width:0;padding:12px;border-radius:11px;background:#f4f8fb}.tr-mobile-ready .tr-subscription-metric strong{overflow:hidden;font-size:.92rem;text-overflow:ellipsis}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] .tr-subscription-metric:nth-child(3){grid-column:1/-1}.tr-native-app .tr-mobile-absence-panel{padding:14px 11px}.tr-native-app .tr-mobile-absence-panel .tr-employee-absence-form{margin-top:0}.tr-native-app .tr-mobile-absence-panel .tr-absence-fields{margin-top:0;border-color:#bfeef5;background:#f1fcfe}.tr-native-app .tr-mobile-absence-panel .tr-absence-fields legend{color:var(--trm-ink);font-weight:850}
.tr-native-app .tr-employee-portal,.tr-native-app .tr-portal-panel,.tr-native-app .tr-employee-call-list,.tr-native-app .tr-employee-call{box-sizing:border-box;width:100%;max-width:100%;min-width:0}.tr-native-app .tr-portal-panel{overflow:hidden}.tr-native-app .tr-employee-call>*{max-width:100%;min-width:0}
.tr-mobile-ready .tr-portal-call-filters,.tr-mobile-ready .tr-employee-sms-form,.tr-mobile-ready .tr-employee-picker{display:grid;grid-template-columns:1fr;gap:10px}.tr-mobile-ready .tr-portal-call-filters{margin-bottom:15px;padding:12px;border-radius:12px;background:#f3f7fa}.tr-mobile-ready .tr-portal-call-filters label,.tr-mobile-ready .tr-employee-sms-form label{gap:5px;font-size:.76rem}.tr-mobile-ready .tr-portal-call-filters input,.tr-mobile-ready .tr-portal-call-filters select,.tr-mobile-ready .tr-employee-sms-form select,.tr-mobile-ready .tr-employee-sms-form textarea,.tr-mobile-ready .tr-portal-form input,.tr-mobile-ready .tr-portal-form select,.tr-mobile-ready .tr-portal-form textarea{box-sizing:border-box;width:100%;min-height:48px;border:1px solid #cbd8e2;border-radius:10px;background:#fff;font-size:16px}.tr-mobile-ready .tr-portal-button,.tr-mobile-ready .tr-portal-link{box-sizing:border-box;min-height:46px;border-radius:10px}
.tr-native-app .tr-employee-absence-form{margin-top:16px}.tr-native-app .tr-absence-fields{box-sizing:border-box;width:100%;min-width:0;margin:16px 0;padding:16px 14px;border-radius:13px;box-shadow:none}.tr-native-app .tr-absence-fields legend{max-width:100%;padding:0 6px;font-size:.95rem}.tr-native-app .tr-absence-fields .description{margin-bottom:12px;font-size:.82rem;line-height:1.5}.tr-native-app .tr-absence-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:12px}.tr-native-app .tr-absence-fields .tr-field{display:grid;min-width:0;margin:0;gap:6px}.tr-native-app .tr-absence-fields .tr-field span{margin:0;font-size:.78rem}.tr-native-app .tr-absence-fields .tr-field em{margin:0;font-size:.75rem;line-height:1.45}.tr-native-app .tr-absence-fields .tr-checkbox{display:grid;grid-template-columns:22px minmax(0,1fr);align-items:start;gap:10px;width:100%;min-width:0;margin:14px 0;font-size:.82rem;line-height:1.45}.tr-native-app .tr-absence-fields .tr-checkbox input[type="checkbox"]{box-sizing:border-box;width:20px!important;height:20px!important;min-width:20px;min-height:20px!important;margin:0!important;padding:0}.tr-native-app .tr-absence-fields textarea{min-height:92px}.tr-native-app .tr-employee-absence-form>.tr-portal-button{width:100%;margin-top:2px}.tr-native-app .tr-employee-portal>.tr-login-actions{display:none}
.tr-mobile-ready .tr-employee-call-list{gap:12px}.tr-mobile-ready .tr-employee-call{position:relative;padding:16px 14px;border:1px solid var(--trm-line);border-radius:15px;box-shadow:0 5px 18px rgba(14,37,61,.05)}.tr-mobile-ready .tr-employee-call-head{align-items:flex-start;flex-direction:column;gap:7px;margin-bottom:12px}.tr-mobile-ready .tr-employee-call-head>div:first-child{display:flex;align-items:center;flex-wrap:wrap;gap:7px}.tr-mobile-ready .tr-employee-call-head>div:last-child{color:var(--trm-ink);font-size:1rem;font-weight:850;white-space:normal}.tr-mobile-ready .tr-status{width:max-content;padding:4px 8px;border-radius:999px;font-size:.63rem}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] .tr-portal-panel-head{margin-bottom:10px}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] .tr-portal-panel-head h2{font-size:1.05rem}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head{display:flex!important;align-items:center!important;flex-direction:row!important;justify-content:flex-start!important;gap:9px;min-height:0;margin:0 0 12px;padding:2px 1px;text-align:left!important}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head>div{display:block}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head p{display:none}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head h2{margin:0;font-size:1.08rem}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head>span{display:inline-grid;width:auto;min-width:28px;height:28px;margin:0;padding:0 8px;border-radius:999px;font-size:.78rem;place-items:center}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] #tr-employee-profile>.tr-portal-panel-head{display:flex!important;align-items:center!important;flex-direction:row!important;justify-content:flex-start!important;gap:9px;min-height:0;margin:0 0 14px;padding:2px 1px;text-align:left!important}.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] #tr-employee-profile>.tr-portal-panel-head>div{display:block}.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] #tr-employee-profile>.tr-portal-panel-head p{display:none}.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] #tr-employee-profile>.tr-portal-panel-head h2{margin:0;font-size:1.08rem}.tr-native-app .tr-employee-portal[data-tr-mobile-view="profil"] #tr-employee-profile>.tr-portal-panel-head>span{display:inline-grid;width:auto;min-width:28px;height:28px;margin:0;padding:0 8px;border-radius:999px;font-size:.78rem;place-items:center}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="guide"] .tr-guide-panel>.tr-portal-panel-head{display:flex!important;align-items:center!important;flex-direction:row!important;justify-content:flex-start!important;min-height:0;margin:0 0 12px;padding:2px 1px;text-align:left!important}.tr-native-app .tr-employee-portal[data-tr-mobile-view="guide"] .tr-guide-panel>.tr-portal-panel-head>div{display:block!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;text-align:left!important}.tr-native-app .tr-employee-portal[data-tr-mobile-view="guide"] .tr-guide-panel>.tr-portal-panel-head p{display:none}.tr-native-app .tr-employee-portal[data-tr-mobile-view="guide"] .tr-guide-panel>.tr-portal-panel-head h2{margin:0!important;font-size:1.08rem;text-align:left!important}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] .tr-portal-call-filters{display:none}.tr-mobile-workflow-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;overflow-x:auto;margin:0 0 14px;padding:2px}.tr-mobile-workflow-filter{display:grid;min-width:0;min-height:52px;padding:7px 3px;border:1px solid var(--trm-line);border-radius:11px;background:#fff;color:var(--trm-muted);font:inherit;place-items:center}.tr-mobile-workflow-filter span{overflow:hidden;width:100%;font-size:.63rem;font-weight:800;text-align:center;text-overflow:ellipsis}.tr-mobile-workflow-filter strong{font-size:.88rem}.tr-mobile-workflow-filter.is-active{border-color:#75dff0;background:#eaf9fd;color:#087d9a;box-shadow:0 0 0 1px #75dff0}.tr-mobile-workflow{margin:13px 0 3px;padding:12px;border:1px solid #d8e6ee;border-radius:12px;background:#f7fafc}.tr-employee-call[data-tr-workflow-status="new"]{border-left:4px solid #d87060}.tr-employee-call[data-tr-workflow-status="new"] .tr-mobile-workflow{border-color:#efd2cc;background:#fff7f5}.tr-employee-call[data-tr-workflow-status="seen"]{border-left:4px solid #65c9dc}.tr-employee-call[data-tr-workflow-status="snoozed"]{border-left:4px solid #e3b341}.tr-employee-call[data-tr-workflow-status="snoozed"] .tr-mobile-workflow{border-color:#edd99d;background:#fffaf0}.tr-employee-call[data-tr-workflow-status="done"]{border-left:4px solid #58ad78}.tr-employee-call[data-tr-workflow-status="done"] .tr-mobile-workflow{border-color:#bfe2cb;background:#f5fcf7}.tr-mobile-workflow-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font-size:.75rem}.tr-mobile-workflow-status{max-width:68%;padding:4px 8px;border-radius:999px;background:#e7edf2;color:#52677c;font-size:.65rem;font-weight:850;text-align:right}.tr-mobile-workflow-status-new{background:#fde5e0;color:#a34232}.tr-mobile-workflow-status-snoozed{background:#fff0c9;color:#805400}.tr-mobile-workflow-status-done{background:#ddf4e5;color:#237443}.tr-mobile-workflow-buttons{display:flex;align-items:stretch;flex-wrap:wrap;gap:7px}.tr-mobile-workflow-buttons>button,.tr-mobile-snooze>summary,.tr-mobile-snooze button{box-sizing:border-box;min-height:40px;padding:8px 11px;border:1px solid #c9d8e3;border-radius:9px;background:#fff;color:var(--trm-ink);font:inherit;font-size:.72rem;font-weight:800;cursor:pointer}.tr-mobile-workflow-buttons>button.is-primary{border-color:var(--trm-navy);background:var(--trm-navy);color:#fff}.tr-mobile-snooze{min-width:0}.tr-mobile-snooze>summary{display:flex;align-items:center;list-style:none}.tr-mobile-snooze>summary::-webkit-details-marker{display:none}.tr-mobile-snooze[open]{flex:1 0 100%}.tr-mobile-snooze[open]>summary{width:max-content;margin-bottom:7px}.tr-mobile-snooze[open]>div{display:grid;position:static;width:100%;box-sizing:border-box;padding:10px;border:1px solid var(--trm-line);border-radius:11px;background:#fff;box-shadow:none;gap:8px}.tr-mobile-snooze label{display:grid;gap:5px;color:var(--trm-muted);font-size:.68rem;font-weight:750}.tr-mobile-snooze input{box-sizing:border-box;width:100%;min-height:42px;border:1px solid #c9d8e3;border-radius:8px;padding:6px;font:inherit;font-size:16px}.tr-mobile-workflow-message{min-height:1em;margin:8px 0 0;color:#a54832;font-size:.7rem}.tr-mobile-workflow-error{margin:0 0 12px;padding:10px;border-radius:10px;background:#fff2ef;color:#9a3e2b;font-size:.78rem}.tr-employee-call[hidden]{display:none!important}
.tr-native-app .tr-call-pagination{display:block;margin:14px 0 2px}.tr-mobile-load-more{box-sizing:border-box;width:100%;min-height:48px;border:1px solid #b9d3df;border-radius:11px;background:#eefafd;color:#087d9a;font:inherit;font-size:.8rem;font-weight:850}.tr-mobile-load-more:disabled{opacity:.65}
.tr-mobile-ready .tr-employee-call-meta{display:flex;gap:6px;overflow-x:auto;margin:0 -14px;padding:0 14px 4px;scrollbar-width:none}.tr-mobile-ready .tr-employee-call-meta::-webkit-scrollbar{display:none}.tr-mobile-ready .tr-employee-call-meta div{min-width:116px;padding:9px 10px;border:0;border-radius:10px;background:#f3f7fa}.tr-mobile-ready .tr-employee-call-meta dt{font-size:.61rem}.tr-mobile-ready .tr-employee-call-meta dd{overflow:hidden;font-size:.76rem;text-overflow:ellipsis;white-space:nowrap}.tr-mobile-ready .tr-employee-call h3{margin:14px 0 5px;color:var(--trm-muted);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}.tr-mobile-ready .tr-employee-call p{margin:0 0 10px;color:var(--trm-ink);font-size:.9rem;line-height:1.55}
.tr-mobile-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0 3px}.tr-mobile-action{min-width:0;padding-inline:8px;font-size:.76rem}.tr-mobile-ready .tr-mobile-sms-panel{margin-top:12px;padding:12px;border:0;border-radius:12px;background:#f3f7fa}.tr-mobile-ready .tr-mobile-sms-panel>summary{display:none}.tr-mobile-ready .tr-employee-sms-form{margin:0}.tr-mobile-ready .tr-employee-sms-form textarea{min-height:116px}
.tr-native-app .tr-login-panel{width:auto;max-width:none;margin:18px 16px 24px;padding:26px 20px;border:1px solid var(--trm-line);border-radius:18px;background:#fff;box-shadow:0 18px 45px rgba(8,29,51,.1)}.tr-native-app .tr-login-panel::before{display:none!important}.tr-native-app .tr-login-panel h1{margin-bottom:8px;font-size:1.7rem;letter-spacing:-.04em}.tr-native-app .tr-login-panel>p:not(.tr-login-notice):not(.tr-login-error){color:var(--trm-muted);font-size:.9rem;line-height:1.55}.tr-native-app .tr-login-panel form{margin-top:22px;padding:0;border:0;box-shadow:none}.tr-native-app .tr-login-panel .button{width:100%;min-height:50px;border:0;border-radius:11px;background:var(--trm-navy);color:#fff;font-size:1rem!important;font-weight:850}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head{justify-content:space-between!important;width:100%!important}.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] #tr-employee-call-log>.tr-portal-panel-head>span{margin-left:auto!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:6px!important;overflow:visible!important;margin:0!important;padding:0!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta>div{display:flex!important;align-items:center!important;justify-content:space-between!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:9px 10px!important;gap:10px!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dt,.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dd{display:block!important;min-width:0!important;margin:0!important;line-height:1.3!important;white-space:nowrap!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dt{font-size:.68rem!important}.tr-native-app :is(#tr-employee-call-log, .tr-mobile-archive-content) .tr-employee-call-meta dd{max-width:65%!important;font-size:.76rem!important;overflow:hidden!important;text-align:right!important;text-overflow:ellipsis!important}
.tr-native-app .tr-employee-portal[data-tr-mobile-view="opkaldslog"] .tr-employee-call-total{display:inline-flex!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;width:auto!important;min-width:76px!important;height:34px!important;padding:0 11px!important;gap:6px!important;white-space:nowrap!important}.tr-native-app .tr-employee-call-total small,.tr-native-app .tr-employee-call-total strong{display:inline!important;margin:0!important;font-size:.72rem!important;line-height:1!important;white-space:nowrap!important}
.tr-mobile-logout-panel{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:10px 0;padding:15px 14px;border:1px solid var(--trm-line);border-radius:14px;background:#fff}.tr-mobile-logout-panel>div{display:grid;gap:3px}.tr-mobile-logout-panel strong{color:var(--trm-ink);font-size:.85rem}.tr-mobile-logout-panel span{color:var(--trm-muted);font-size:.7rem;line-height:1.4}.tr-mobile-logout{flex:0 0 auto;padding:10px 14px;border:1px solid #e3aaa2;border-radius:10px;background:#fff7f5;color:#9a3e2b;font-size:.76rem;font-weight:850;text-decoration:none}
.tr-native-app .tr-mobile-appbar,.tr-mobile-ready .tr-employee-portal{box-sizing:border-box;width:100vw!important;max-width:none!important;margin-right:calc(50% - 50vw)!important;margin-left:calc(50% - 50vw)!important}.tr-mobile-ready .tr-employee-portal{padding:10px 8px calc(92px + var(--trm-safe-bottom));transition:opacity .14s ease}.tr-mobile-ready .tr-employee-portal.tr-mobile-view-loading{opacity:.55;pointer-events:none}.tr-mobile-ready .tr-portal-hero{margin-bottom:9px;padding:18px 15px;border-radius:14px}.tr-mobile-ready .tr-portal-panel{margin:9px 0;padding:15px 11px;border-radius:14px}.tr-mobile-ready .tr-subscription-grid{gap:7px}.tr-mobile-ready .tr-subscription-metric{padding:11px 9px}.tr-mobile-ready .tr-subscription-metric strong{font-size:.88rem}.tr-mobile-mark{width:36px;height:36px;border-radius:0;background:none}.tr-mobile-mark img{display:block;width:36px;height:36px;border-radius:0}.tr-native-app .tr-absence-fields select,.tr-native-app .tr-absence-fields input:not([type="checkbox"]),.tr-native-app .tr-absence-fields textarea,.tr-native-app #tr-employee-profile .tr-portal-form input:not([type="checkbox"]):not([type="hidden"]),.tr-native-app #tr-employee-profile .tr-portal-form select,.tr-native-app #tr-employee-profile .tr-portal-form textarea{font-size:14px!important;font-weight:600!important}.tr-native-app .tr-absence-fields select,.tr-native-app #tr-employee-profile .tr-portal-form select{padding-right:34px!important}
}

/* Keep all five workflow filters visible on one row in the native app. */
.tr-native-app .tr-mobile-workflow-filters {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    overflow: visible;
}

.tr-native-app .tr-mobile-archive-content {
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* iPad layout for the native-app login screen. Keep this scoped to the
   tablet breakpoint so the existing phone layout remains unchanged. */
@media (min-width:721px) and (max-width:1100px) {
    html.tr-native-shell,
    body.tr-native-app {
        min-height:100%;
        height:auto!important;
        overflow-x:hidden!important;
        overflow-y:auto!important;
        overscroll-behavior-y:none!important;
        -webkit-overflow-scrolling:touch!important;
        touch-action:pan-y!important;
        background:#fff!important;
    }

    body.tr-native-app .wp-site-blocks,
    body.tr-native-app .tr-page-main,
    body.tr-native-app .entry-content {
        min-height:100%;
        height:auto!important;
        overflow:visible!important;
        background:#fff!important;
    }

    body.tr-native-app .tr-login-panel {
        width:min(100%,1120px)!important;
        max-width:none!important;
        margin:0 auto 32px!important;
        padding:0 28px 32px!important;
        border:0!important;
        border-radius:0!important;
        box-shadow:none!important;
        background:#fff!important;
        transform:none!important;
    }

    body.tr-native-app .tr-mobile-login-landing {
        width:100%!important;
        max-width:1120px!important;
        margin:0 auto 30px!important;
        border-radius:0!important;
    }

    body.tr-native-app .tr-mobile-login-landing-head { padding:40px 48px 36px!important; }
    body.tr-native-app .tr-mobile-login-landing h2 { max-width:760px; font-size:clamp(2.2rem,5vw,4.2rem)!important; line-height:1.04!important; }
    body.tr-native-app .tr-mobile-login-landing-image { height:clamp(400px,47vw,640px)!important; object-fit:cover!important; object-position:center 70%!important; }
    body.tr-native-app .tr-mobile-login-landing-copy { padding:28px 48px 30px!important; }

    body.tr-native-app .tr-login-panel form {
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        column-gap:20px!important;
        row-gap:14px!important;
        align-items:end!important;
        margin-top:24px!important;
        padding:0!important;
        border:0!important;
        box-shadow:none!important;
        background:transparent!important;
    }
    body.tr-native-app .tr-login-panel form label:not(.tr-login-remember) { display:grid!important; gap:8px!important; margin:0!important; }
    body.tr-native-app .tr-login-panel form label.tr-login-remember,
    body.tr-native-app .tr-login-panel form button[type=submit],
    body.tr-native-app .tr-login-panel form p { grid-column:1/-1!important; }
    body.tr-native-app .tr-login-panel form p { margin:0!important; }
    body.tr-native-app .tr-login-panel input[type=text],
    body.tr-native-app .tr-login-panel input[type=password] { width:100%!important; min-height:54px!important; }
    body.tr-native-app .tr-login-panel .button {
        width:auto!important;
        min-width:160px;
        min-height:54px!important;
        justify-self:start;
        appearance:none!important;
        -webkit-appearance:none!important;
        background:var(--trm-navy)!important;
        color:#fff!important;
        font:inherit!important;
        font-size:1rem!important;
        font-weight:850!important;
        line-height:1.2!important;
    }
}

/* Keep the native app navigation fixed on iPad/tablet while the page scrolls. */
@media (min-width:721px) and (max-width:1100px) {
    html.tr-native-shell,
    body.tr-native-app {
        overflow-x:hidden!important;
        overflow-y:auto!important;
        -webkit-overflow-scrolling:touch!important;
        touch-action:pan-y!important;
    }
    body.tr-native-app .tr-employee-portal,
    body.tr-native-app .tr-portal-panel,
    body.tr-native-app #tr-employee-call-log,
    body.tr-native-app .tr-employee-call-list {
        overflow:visible!important;
        touch-action:pan-y!important;
    }
    html.tr-native-shell:has(body.tr-mobile-dialog-open) {
        overflow:hidden!important;
    }
    body.tr-native-app .tr-mobile-archive-detail {
        touch-action:none!important;
    }
    body.tr-native-app .tr-mobile-archive-sheet {
        overflow:hidden!important;
    }
    body.tr-native-app .tr-mobile-archive-sheet > .tr-mobile-archive-content {
        overflow-x:hidden!important;
        overflow-y:auto!important;
        -webkit-overflow-scrolling:touch!important;
        overscroll-behavior:contain!important;
        touch-action:pan-y!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-portal {
        padding-bottom:calc(96px + var(--trm-safe-bottom))!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav {
        position:fixed!important;
        z-index:100!important;
        right:0!important;
        bottom:0!important;
        left:0!important;
        display:grid!important;
        box-sizing:border-box!important;
        grid-template-columns:repeat(5,minmax(0,1fr))!important;
        width:100vw!important;
        max-width:100vw!important;
        min-height:calc(76px + var(--trm-safe-bottom))!important;
        margin:0!important;
        padding:8px max(16px,var(--trm-safe-right)) var(--trm-safe-bottom) max(16px,var(--trm-safe-left))!important;
        overflow:hidden!important;
        border-top:1px solid #dce5ec!important;
        background:rgba(255,255,255,.97)!important;
        box-shadow:0 -10px 32px rgba(9,31,54,.1)!important;
        backdrop-filter:blur(16px);
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav a {
        display:flex!important;
        box-sizing:border-box!important;
        align-items:center!important;
        flex-direction:column!important;
        justify-content:center!important;
        justify-self:center!important;
        gap:6px!important;
        width:min(100%,124px)!important;
        max-width:124px!important;
        min-width:0!important;
        min-height:60px!important;
        margin-inline:auto!important;
        padding:5px 4px!important;
        border:0!important;
        border-radius:10px!important;
        overflow:hidden!important;
        background:transparent!important;
        color:#75869a!important;
        text-decoration:none!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav a.is-active {
        background:#eaf9fd!important;
        color:#087d9a!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav a strong {
        display:block!important;
        box-sizing:border-box!important;
        width:100%!important;
        min-width:0!important;
        overflow:hidden!important;
        color:inherit!important;
        font-size:.76rem!important;
        font-weight:850!important;
        line-height:1.1!important;
        text-align:center!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav a span {
        display:none!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-view-nav svg {
        width:24px!important;
        height:24px!important;
        flex:0 0 auto!important;
    }
}

/* Profile has an older ID-scoped header rule; keep it on the same rhythm. */
@media (max-width:1100px) {
    body.tr-native-app.tr-mobile-ready .tr-employee-portal.tr-employee-view-profil #tr-employee-profile > .tr-portal-panel-head {
        display:flex!important;
        align-items:center!important;
        flex-direction:row!important;
        justify-content:space-between!important;
        gap:16px!important;
        min-height:0!important;
        margin:0 0 14px!important;
        padding:16px 16px 0!important;
        text-align:left!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-portal.tr-employee-view-profil #tr-employee-profile > .tr-portal-panel-head > div {
        display:block!important;
        width:auto!important;
        max-width:none!important;
        margin:0!important;
        padding:0!important;
        text-align:left!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-portal.tr-employee-view-profil #tr-employee-profile > .tr-portal-panel-head p {
        display:block!important;
        margin:0 0 5px!important;
        color:#5a30ec!important;
        font-size:.65rem!important;
        font-weight:900!important;
        letter-spacing:.13em!important;
        line-height:1.3!important;
        text-transform:uppercase!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-portal.tr-employee-view-profil #tr-employee-profile > .tr-portal-panel-head h2 {
        margin:0!important;
        color:var(--trm-ink)!important;
        font-size:1.25rem!important;
        line-height:1.1!important;
        letter-spacing:-.025em!important;
    }
    body.tr-native-app.tr-mobile-ready .tr-employee-portal.tr-employee-view-profil #tr-employee-profile > .tr-portal-panel-head > span {
        display:inline-flex!important;
        flex:0 0 auto!important;
        align-items:center!important;
        width:auto!important;
        min-width:0!important;
        margin:0!important;
        padding:8px 11px!important;
        border-radius:999px!important;
        font-size:.78rem!important;
        white-space:nowrap!important;
    }
}

/* The employee identity card is useful on Calls, but wastes the app
 * viewport on the four utility views. Keep the Calls hero unchanged. */
@media (max-width:1100px) {
    body.tr-native-app .tr-employee-portal:not(.tr-employee-view-opkaldslog) > .tr-portal-hero[data-tr-personal-welcome="1"] {
        display:none!important;
    }
}

/* Use the Messages header rhythm consistently across the four utility views. */
@media (max-width:1100px) {
    body.tr-native-app .tr-employee-portal:is(.tr-employee-view-beskeder, .tr-employee-view-fravaer, .tr-employee-view-hjaelp, .tr-employee-view-profil) .tr-portal-panel-head {
        display:flex!important;
        align-items:center!important;
        flex-direction:row!important;
        justify-content:space-between!important;
        gap:16px!important;
        min-height:0!important;
        margin:0 0 14px!important;
        padding:16px 16px 0!important;
        text-align:left!important;
    }

    body.tr-native-app .tr-employee-portal:is(.tr-employee-view-beskeder, .tr-employee-view-fravaer, .tr-employee-view-hjaelp, .tr-employee-view-profil) .tr-portal-panel-head > div {
        display:block!important;
        width:auto!important;
        max-width:none!important;
        margin:0!important;
        padding:0!important;
        text-align:left!important;
    }

    body.tr-native-app .tr-employee-portal:is(.tr-employee-view-beskeder, .tr-employee-view-fravaer, .tr-employee-view-hjaelp, .tr-employee-view-profil) .tr-portal-panel-head p {
        margin:0 0 5px!important;
        color:#5a30ec!important;
        font-size:.65rem!important;
        font-weight:900!important;
        letter-spacing:.13em!important;
        line-height:1.3!important;
        text-transform:uppercase!important;
    }

    body.tr-native-app .tr-employee-portal:is(.tr-employee-view-beskeder, .tr-employee-view-fravaer, .tr-employee-view-hjaelp, .tr-employee-view-profil) .tr-portal-panel-head h2 {
        margin:0!important;
        color:var(--trm-ink)!important;
        font-size:1.25rem!important;
        line-height:1.1!important;
        letter-spacing:-.025em!important;
    }

    body.tr-native-app .tr-employee-portal:is(.tr-employee-view-beskeder, .tr-employee-view-fravaer, .tr-employee-view-hjaelp, .tr-employee-view-profil) .tr-portal-panel-head > span {
        display:inline-flex!important;
        flex:0 0 auto!important;
        align-items:center!important;
        width:auto!important;
        min-width:0!important;
        margin:0!important;
        padding:8px 11px!important;
        border-radius:999px!important;
        font-size:.78rem!important;
        white-space:nowrap!important;
    }
}

/* Keep the employee Messages view aligned even when the native shell adds
 * only tr-mobile-ready or the view data attribute after initial render. */
@media (max-width: 720px) {
    .tr-mobile-ready .tr-employee-portal[data-tr-mobile-view="beskeder"],
    .tr-mobile-ready .tr-employee-portal.tr-employee-view-beskeder {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
        transform: none !important;
    }

    .tr-mobile-ready .tr-employee-portal[data-tr-mobile-view="beskeder"] > [data-tr-chat],
    .tr-mobile-ready .tr-employee-portal.tr-employee-view-beskeder > [data-tr-chat] {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
    }
}

/* STAGING TEST 2026-09-26 v3: let the workflow section share the native
 * call hero's right edge. The higher-specificity selector overrides the
 * generic direct-child max-width constraint. */
.tr-native-app .tr-employee-call > .tr-employee-workflow {
    width: calc(100% + 50px) !important;
    max-width: calc(100% + 50px) !important;
    margin-right: -50px !important;
}

.tr-native-app .tr-workflow-control-grid,
.tr-native-app .tr-employee-workflow-actions {
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
}

/* The edge-alignment compensation above is for the main call list only.
 * Archive cards live inside a modal and must stay within its right edge. */
.tr-native-app .tr-mobile-archive-content .tr-employee-call > .tr-employee-workflow {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Staging app: keep the call date pinned to the lower-left corner. */
@media (max-width:720px) {
    body.tr-native-app .tr-mobile-call-header > .tr-mobile-call-date {
        bottom:11px!important;
        left:14px!important;
        right:50%!important;
        text-align:left!important;
    }
}


/* Keep a visible breathing space below the native app header. */
.tr-native-app .tr-mobile-ready .tr-employee-portal,
.tr-native-app .tr-employee-portal.tr-mobile-ready {
    padding-top: 16px!important;
}

/* On iPad/tablet the call workflow must stay inside the call card. The
 * mobile edge-alignment compensation is intentionally not used there. */
@media (min-width: 721px) and (max-width: 1100px) {
    .tr-native-app .tr-employee-call > .tr-employee-workflow {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Kompakt opkaldssøgning i Android- og iOS-skallen. */
.tr-native-app .tr-mobile-call-search-open{display:inline-grid;flex:0 0 34px;width:34px;height:34px;margin-left:auto;padding:0;border:1px solid #c8d9e4;border-radius:50%;background:#fff;color:var(--trm-navy);cursor:pointer;place-items:center}
.tr-native-app .tr-mobile-call-search-open svg{width:18px;height:18px;fill:currentColor}
.tr-native-app #tr-employee-call-log>.tr-portal-panel-head .tr-mobile-call-search-open+.tr-employee-call-total{margin-left:0!important}
.tr-mobile-dialog-open{overflow:hidden}
.tr-mobile-call-search[hidden]{display:none!important}
.tr-mobile-call-search{position:fixed;z-index:300;inset:0;display:flex;box-sizing:border-box;align-items:flex-end;justify-content:center;padding:calc(14px + var(--trm-safe-top)) max(10px,var(--trm-safe-right)) calc(10px + var(--trm-safe-bottom)) max(10px,var(--trm-safe-left));background:rgba(4,20,38,.56);backdrop-filter:blur(3px)}
.tr-mobile-call-search-sheet{display:flex;box-sizing:border-box;flex-direction:column;width:100%;height:min(82vh,720px);max-height:min(82vh,720px);min-height:0;overflow:hidden;touch-action:pan-y;max-width:560px;padding:16px;border-radius:20px 20px 14px 14px;background:#fff;box-shadow:0 24px 65px rgba(4,20,38,.3)}
.tr-mobile-call-search-sheet>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.tr-mobile-call-search-sheet h2{margin:0;color:var(--trm-ink);font-size:1.18rem;letter-spacing:-.025em}
.tr-mobile-call-search-sheet [data-tr-search-close]{display:grid;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:#edf3f7;color:var(--trm-ink);font:inherit;font-size:1.45rem;line-height:1;place-items:center}
.tr-mobile-call-search-sheet form{display:grid;gap:7px}
.tr-mobile-call-search-sheet form>label{color:var(--trm-muted);font-size:.73rem;font-weight:750}
.tr-mobile-call-search-sheet form>div{display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;box-sizing:border-box;min-height:50px;padding:0 13px;border:1px solid #b9ccd9;border-radius:12px;background:#f8fbfd;gap:8px}
.tr-mobile-call-search-sheet form svg{display:block;width:19px;height:19px;fill:#60768a}
.tr-mobile-call-search-sheet input{box-sizing:border-box;width:100%;min-width:0;height:48px;padding:0;border:0!important;outline:0;background:transparent!important;color:var(--trm-ink);font:inherit;font-size:16px!important;font-weight:650;box-shadow:none!important}
.tr-mobile-call-search-state{min-height:1.2em;margin:11px 1px 8px;color:var(--trm-muted);font-size:.72rem}
.tr-mobile-call-search-results{display:grid;flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;gap:7px}
.tr-mobile-call-search-result{display:grid;position:relative;box-sizing:border-box;width:100%;padding:12px 38px 12px 13px;border:1px solid #d8e3ea;border-radius:12px;background:#fff;color:var(--trm-ink);font:inherit;text-align:left;gap:3px}
.tr-mobile-call-search-result strong{overflow:hidden;font-size:.87rem;text-overflow:ellipsis;white-space:nowrap}
.tr-mobile-call-search-result span{overflow:hidden;color:#52677b;font-size:.7rem;text-overflow:ellipsis;white-space:nowrap}
.tr-mobile-call-search-result small{position:absolute;right:12px;top:50%;overflow:hidden;width:20px;color:#087d9a;font-size:0;transform:translateY(-50%)}
.tr-mobile-call-search-result small::after{content:'›';font-size:1.45rem;font-weight:500}
.tr-mobile-call-search-result:disabled{opacity:.58}
.tr-mobile-call-search-more{box-sizing:border-box;width:100%;min-height:44px;margin-top:9px;border:1px solid #b9d3df;border-radius:10px;background:#eefafd;color:#087d9a;font:inherit;font-size:.76rem;font-weight:850}
.tr-mobile-search-target{animation:tr-mobile-search-highlight 2.6s ease}
@keyframes tr-mobile-search-highlight{0%,30%{box-shadow:0 0 0 4px rgba(12,190,222,.32)}100%{box-shadow:0 5px 18px rgba(14,37,61,.05)}}
@media (min-width:700px){.tr-mobile-call-search{align-items:center}.tr-mobile-call-search-sheet{border-radius:20px}}

.tr-native-app .tr-mobile-login-landing{margin:-26px -20px 24px;overflow:hidden;border-radius:18px 18px 0 0;background:#fff}.tr-native-app .tr-mobile-login-landing-head{padding:24px 20px 25px;background:linear-gradient(145deg,var(--trm-navy),#123d68);color:#fff}.tr-native-app .tr-mobile-login-landing-eyebrow{margin:0 0 7px!important;color:var(--trm-cyan)!important;font-size:.65rem!important;font-weight:900!important;letter-spacing:.13em;line-height:1.3!important;text-transform:uppercase}.tr-native-app .tr-mobile-login-landing h2{margin:0;color:#fff;font-size:clamp(1.55rem,7.5vw,2.1rem);line-height:1.05;letter-spacing:-.045em}.tr-native-app .tr-mobile-login-landing-image{display:block;width:100%;height:218px;object-fit:cover;object-position:center 70%}.tr-native-app .tr-mobile-login-landing-copy{padding:20px 20px 22px;background:#fff;color:var(--trm-muted)}.tr-native-app .tr-mobile-login-landing-copy>p{margin:0 0 17px;color:var(--trm-muted);font-size:.91rem;line-height:1.5}.tr-native-app .tr-mobile-login-landing-link{display:inline-flex;align-items:center;gap:7px;color:var(--trm-navy);font-size:.8rem;font-weight:800;text-underline-offset:3px}.tr-native-app .tr-mobile-login-landing-link span{color:#08aeca;font-size:1rem}.tr-native-app .tr-login-panel>h1{margin-top:0}
body.tr-native-app .tr-mobile-appbar{margin-top:0!important}
body.tr-native-app .tr-login-panel{margin-top:0!important;padding-top:0!important;transform:translateY(8px)}
body.tr-native-app .tr-mobile-login-landing{margin-top:0!important}
body.tr-native-app .tr-mobile-login-landing-head{padding-top:32px}

/* Intern lydafspiller i Android- og iOS-skallen. */
.tr-mobile-audio-dialog[hidden]{display:none!important}
.tr-mobile-audio-dialog{position:fixed;z-index:310;inset:0;display:flex;box-sizing:border-box;align-items:center;justify-content:center;padding:calc(16px + var(--trm-safe-top)) max(12px,var(--trm-safe-right)) calc(16px + var(--trm-safe-bottom)) max(12px,var(--trm-safe-left));background:rgba(3,18,34,.62);backdrop-filter:blur(5px)}
.tr-mobile-audio-sheet{box-sizing:border-box;width:100%;max-width:480px;overflow:hidden;border-radius:20px;background:#fff;box-shadow:0 24px 70px rgba(2,15,30,.38)}
.tr-mobile-audio-sheet>header{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;background:var(--trm-navy);color:#fff;gap:12px}
.tr-mobile-audio-sheet>header small{display:block;color:var(--trm-cyan);font-size:.62rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}
.tr-mobile-audio-sheet>header h2{margin:3px 0 0;color:#fff;font-size:1.08rem}
.tr-mobile-audio-sheet [data-tr-audio-close]{display:grid;flex:0 0 40px;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.13);color:#fff;font:inherit;font-size:1.5rem;place-items:center}
.tr-mobile-audio-body{display:grid;padding:22px 18px 20px;text-align:center;gap:12px}
.tr-mobile-audio-icon{display:grid;width:54px;height:54px;margin:auto;border-radius:50%;background:#e8f9fd;color:#087d9a;place-items:center}
.tr-mobile-audio-icon svg{width:27px;height:27px;fill:currentColor}
.tr-mobile-audio-body>p{margin:0!important;color:var(--trm-muted)!important;font-size:.8rem!important}
.tr-mobile-audio-body audio{display:block;box-sizing:border-box;width:100%;min-height:48px}
.tr-mobile-audio-state{min-height:1.2em;color:#9a3e2b!important;font-size:.72rem!important}

.tr-mobile-archive-detail{box-sizing:border-box;min-width:0;position:fixed;z-index:9999!important;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(4,20,38,.56);padding:var(--trm-safe-top) var(--trm-safe-right) var(--trm-safe-bottom) var(--trm-safe-left)}
.tr-mobile-archive-sheet{display:flex!important;flex-direction:column!important;box-sizing:border-box;min-width:0;width:100%;height:80vh!important;max-height:80vh!important;min-height:80vh!important;max-width:700px;overflow:hidden!important;overscroll-behavior:contain;border-radius:18px;background:#f4f7fa;padding:16px}
.tr-mobile-archive-sheet>.tr-mobile-archive-content{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain!important}
.tr-mobile-archive-sheet>header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tr-mobile-archive-sheet h2{margin:0;font-size:1.2rem;color:var(--trm-ink)}
.tr-mobile-archive-sheet [data-tr-archive-close]{width:44px;height:44px;border:0;border-radius:50%;font-size:1.5rem;background:#fff;color:var(--trm-ink)}
.tr-native-app .tr-mobile-archive-content{box-sizing:border-box;width:100%!important;max-width:100%!important;min-width:0!important;display:block!important;padding:12px 0!important;margin:0!important;min-height:0!important}

/* Give every call a clear start and identify the customer before its workflow. */
.tr-native-app #tr-employee-call-log .tr-employee-call-list{gap:22px!important}
.tr-native-app :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-call{border-top-color:#b5c8d8;box-shadow:0 4px 14px rgba(7,26,51,.09)}

/* Compact actions in the shared call card. */
.tr-native-app :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-action{display:flex!important;align-items:center;justify-content:center!important;width:100%!important;min-height:46px!important;box-sizing:border-box!important;padding:10px 14px!important;white-space:normal!important;text-align:center!important}
.tr-native-app :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-action .tr-call-recording-icon{display:inline-flex!important;width:18px!important;height:18px!important;flex:0 0 18px!important}
.tr-native-app .tr-workflow-control-preserve{background:#fff1ee!important;border-color:#e7a091!important;color:#a53b2d!important}
.tr-native-app :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-panel:not([open]){display:none!important}

/* Shared call action contract. Keep the native shell on the same dimensions,
 * spacing and typography as the desktop portal after the shell hydrates. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-action,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-transfer > summary,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-web-conversation-toggle,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-secure-message > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:14px 0 0!important;
    padding:13px 16px!important;
    border-radius:10px!important;
    gap:9px!important;
    font-size:.86rem!important;
    font-weight:850!important;
    line-height:1.25!important;
    text-align:center!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-action,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-web-conversation-toggle {
    border:1px solid #cbd9e4!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-transfer > summary {
    border:1px solid #e8d99c!important;
    background:#fffaf0!important;
    color:#7a5200!important;
    cursor:pointer!important;
    list-style:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-secure-message > summary {
    border:1px solid #9fe7f0!important;
    background:#eefbfe!important;
    color:#087d9a!important;
    cursor:pointer!important;
    list-style:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-transfer,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-secure-message {
    margin-top:14px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-transfer[open] {
    padding:12px 14px!important;
    border:1px solid #e8d99c!important;
    border-radius:10px!important;
    background:#fffaf0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-transfer[open] > summary {
    width:calc(100% + 28px)!important;
    margin:-12px -14px 12px!important;
    border-radius:10px 10px 0 0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-secure-message[open] {
    padding:12px 15px 15px!important;
    border:1px solid #a9e9f3!important;
    border-radius:10px!important;
    background:#eefbfe!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-secure-message[open] > summary {
    width:calc(100% + 30px)!important;
    margin:-12px -15px 12px!important;
    border-radius:10px 10px 0 0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-icon,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-transfer-action-icon,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-conversation-action-icon,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-secure-action-icon {
    display:inline-flex!important;
    flex:0 0 19px!important;
    width:19px!important;
    height:19px!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-recording-icon svg,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-transfer-action-icon svg,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-conversation-action-icon svg,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-secure-action-icon svg {
    width:100%!important;
    height:100%!important;
    fill:currentColor!important;
}
/* The native toolbar owns SMS; keep the original details summary hidden from
 * the first paint as well as after JavaScript adds .tr-mobile-sms-panel. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-sms-reply > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border:1px solid #cbd9e4!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
    font-size:.86rem!important;
    font-weight:850!important;
    gap:9px!important;
    line-height:1.25!important;
    text-align:center!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-panel {
    display:block!important;
}
:is(.tr-native-app,.tr-mobile-ready) .tr-mobile-sms-summary-hidden {
    display:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) .tr-mobile-conversation-open {
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border:1px solid #cbd9e4!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
    font-size:.86rem!important;
    font-weight:850!important;
    gap:9px!important;
}

:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-action-stack {
    display:grid!important;
    gap:10px!important;
    width:100%!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions {
    margin-top:14px!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-action-stack {
    /* The action menu already supplies the separation between the two
       groups. Do not add a second vertical margin before recording/transfer. */
    margin-top:0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions:empty,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-action-stack:empty {
    display:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-call-back-action {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border:1px solid #071a33!important;
    border-radius:10px!important;
    background:#071a33!important;
    color:#fff!important;
    font-size:.86rem!important;
    font-weight:850!important;
    gap:9px!important;
    line-height:1.25!important;
    text-align:center!important;
    text-decoration:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-sms-reply {
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-sms-reply > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border:1px solid #cbd9e4!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
    font-size:.86rem!important;
    font-weight:850!important;
    gap:9px!important;
    line-height:1.25!important;
    text-align:center!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-sms-reply[open] {
    padding:0!important;
    border:0!important;
    background:transparent!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-web-conversation-toggle {
    margin:0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-back-icon {
    display:inline-flex!important;
    flex:0 0 19px!important;
    width:19px!important;
    height:19px!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-back-icon svg {
    width:100%!important;
    height:100%!important;
    fill:currentColor!important;
}

.tr-mobile-conversation-messages{overflow-anchor:none}

/* On mobile the native/browser action opens the form. The form title is
 * informational and must not become a second button. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-sms-reply > summary {
    display:none!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-employee-sms-form-title {
    display:block!important;
    margin:0 0 2px!important;
    color:var(--trm-ink)!important;
    font-size:1rem!important;
    line-height:1.25!important;
}

/* Shared contact-action contract for browser mobile and native Android/iOS.
 * Keep the primary call and both message channels stacked in one predictable
 * order; utility actions remain below in the shared action stack. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-actions {
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > *,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-action-stack > *,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-actions > * {
    margin-top:0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > details:not([open]) > summary,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-action-stack > details:not([open]) > summary {
    margin-top:0!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-action,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-toggle,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-secure-message > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border-radius:10px!important;
    font-size:.86rem!important;
    font-weight:850!important;
    line-height:1.25!important;
    text-align:center!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-action,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-toggle,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-secure-message > summary {
    border:1px solid #cbd9e4!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
    gap:9px!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-action-primary,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-call-back-action {
    border-color:var(--trm-navy)!important;
    background:var(--trm-navy)!important;
    color:#fff!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-employee-secure-message {
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
}

/* Keep the completed “Set” slot in the workflow grid so the remaining
 * status actions never jump to a new position. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-workflow-control-seen:disabled {
    border-color:#d5dde4!important;
    background:#e8edf1!important;
    color:#8795a3!important;
    cursor:default!important;
    opacity:1!important;
}

/* Keep the bottom action above Android/iOS system navigation while the
   workflow sheet is scrolled. */
.tr-native-app .tr-workflow-dialog-sheet {
    padding-bottom:calc(16px + var(--trm-safe-bottom))!important;
}

/* A new customer reply should be immediately recognizable while scrolling. */
.tr-mobile-conversation-open.has-unread {
    background:#dff6e7!important;
    background-color:#dff6e7!important;
    background-image:none!important;
    border-color:#86d6a8!important;
    color:#166534!important;
    box-shadow:0 0 0 3px rgba(71,190,115,.12)!important;
}

/* Keep the standard-reply picker compact in the native Android/iOS shell. */
.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-template,
.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-template option {
    font-size:.78rem!important;
    line-height:1.25!important;
}
.tr-native-app .tr-mobile-sms-panel .tr-employee-sms-template {
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    clip-path:inset(50%)!important;
    white-space:nowrap!important;
}
.tr-native-app .tr-mobile-sms-picker { position:relative; width:100%; }
.tr-native-app .tr-mobile-sms-picker-trigger,
.tr-native-app .tr-mobile-sms-picker-option {
    box-sizing:border-box;
    width:100%;
    border:1px solid #cbd8e2;
    border-radius:10px;
    background:#fff;
    color:var(--tr-ink);
    font:inherit;
    font-size:.82rem;
    line-height:1.35;
    text-align:left;
}
.tr-native-app .tr-mobile-sms-picker-trigger {
    min-height:48px;
    padding:10px 38px 10px 12px;
    font-weight:750;
}
.tr-native-app .tr-mobile-sms-picker-options {
    position:absolute;
    z-index:20;
    top:calc(100% + 5px);
    right:0;
    left:0;
    display:grid;
    max-height:260px;
    overflow-y:auto;
    padding:4px;
    border:1px solid #cbd8e2;
    border-radius:10px;
    background:#fff;
    box-shadow:0 12px 28px rgba(7,26,51,.18);
}
.tr-native-app .tr-mobile-sms-picker-options[hidden] { display:none; }
.tr-native-app .tr-mobile-sms-picker-option {
    border:0;
    border-radius:7px;
    padding:10px 11px;
}
.tr-native-app .tr-mobile-sms-picker-option[aria-selected="true"] {
    background:#e8f8ee;
    color:#166534;
    font-weight:800;
}
.tr-native-app .tr-mobile-sms-picker-option:active,
.tr-native-app .tr-mobile-sms-picker-option:focus-visible { background:#e8f8ee; }
.tr-native-app :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-conversation-open.has-unread {
    background:#dff6e7!important;
    background-color:#dff6e7!important;
    background-image:none!important;
    border-color:#86d6a8!important;
    color:#166534!important;
}

/* SMS is a permanent contact action. Keep the closed details element in the
 * action stack and expose its summary; only the form body stays collapsed. */
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-panel:not([open]) {
    display:block!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
}
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-mobile-sms-panel > summary,
:is(.tr-native-app,.tr-mobile-ready) :is(#tr-employee-call-log,.tr-mobile-archive-content) .tr-call-primary-actions > .tr-mobile-sms-panel > summary {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:13px 16px!important;
    border:1px solid #cbd9e4!important;
    border-radius:10px!important;
    background:#fff!important;
    color:var(--trm-ink)!important;
    font-size:.86rem!important;
    font-weight:850!important;
    gap:9px!important;
    line-height:1.25!important;
    text-align:center!important;
}

/* Five-button app navigation order. */
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="opkaldslog"]{order:1!important}
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="beskeder"]{order:2!important}
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="fravaer"]{order:3!important}
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="hjaelp"]{order:4!important}
.tr-mobile-ready .tr-employee-view-nav a[data-tr-mobile-view="profil"]{order:5!important}

/* The native Android/iOS shell owns its header. Never show the separate
 * desktop employee header inside the native portal. */
.tr-native-app .tr-employee-app-header{display:none!important}

/* The Android/iOS shell must not depend on the WebView's reported width. */
body.tr-native-app .tr-mobile-appbar {
    position:sticky!important;
    top:0!important;
    z-index:50!important;
    display:flex!important;
    box-sizing:border-box;
    align-items:center;
    justify-content:space-between;
    width:100vw!important;
    min-height:calc(62px + var(--trm-safe-top));
    margin:0!important;
    padding:var(--trm-safe-top) max(18px,var(--trm-safe-right)) 0 max(18px,var(--trm-safe-left));
    background:rgba(7,26,51,.97);
    color:#fff;
}

/* The native shell must own the complete viewport at every WebView width.
 * Keep the public WordPress chrome out of the employee app instead of relying
 * on the mobile media query; some Android WebViews report a wider layout
 * viewport while still rendering on a phone. */
body.tr-native-app .wp-site-blocks > header.wp-block-template-part,
body.tr-native-app .wp-site-blocks > footer.wp-block-template-part,
body.tr-native-app .tr-header,
body.tr-native-app .tr-topbar-slider-shell,
body.tr-native-app .tr-page-topline,
body.tr-native-app .tr-brand-footer,
body.tr-native-app .tr-employee-app-header {
    display:none!important;
}

body.tr-native-app .tr-mobile-appbar {
    min-height:calc(62px + var(--trm-safe-top))!important;
    max-height:calc(62px + var(--trm-safe-top))!important;
    overflow:hidden!important;
}
body.tr-native-app .tr-employee-portal {
    padding-top:16px!important;
}
body.tr-native-app .tr-employee-view-nav a > svg:not(:first-of-type) {
    display:none!important;
}
body.tr-native-app .tr-employee-view-nav a > svg:not([data-tr-mobile-icon]) {
    display:none!important;
}

/* The shared frontend stylesheet also adds legacy navigation icons through
 * a::before. The mobile navigation already owns one explicit SVG icon per
 * item, so suppress the legacy pseudo-element in the native app only. */
body.tr-native-app .tr-employee-view-nav a::before {
    display:none!important;
    content:none!important;
    -webkit-mask:none!important;
    mask:none!important;
}
body.tr-native-app .tr-transfer-search {
    box-sizing:border-box;
    width:100%;
    min-height:46px;
    border:1px solid #b8c8d8;
    border-radius:9px;
    padding:10px 12px;
    background:#fff;
    color:var(--trm-ink);
    font:inherit;
    font-size:16px;
}
body.tr-native-app .tr-transfer-results {
    display:grid;
    gap:6px;
    margin-top:5px;
}
body.tr-native-app .tr-transfer-results[hidden] { display:none!important; }
body.tr-native-app .tr-transfer-result {
    min-height:42px;
    padding:9px 11px;
    border:1px solid #c9d8e3;
    border-radius:8px;
    background:#f7fafc;
    color:var(--trm-ink);
    font:inherit;
    font-size:.82rem;
    text-align:left;
}

/* Isolated native mobile call header. One markup contract for Android and iOS.
 * Desktop header rules remain outside this native-app scope. */
@media (max-width:720px) {
    body.tr-native-app .tr-mobile-call-header {
        position:relative!important;
        display:block!important;
        box-sizing:border-box!important;
        width:100%!important;
        min-width:0!important;
        min-height:76px!important;
        margin:0 0 14px!important;
        padding:11px 14px!important;
        border-radius:10px!important;
        background:var(--trm-navy)!important;
        color:#fff!important;
    }

    body.tr-native-app .tr-mobile-call-phone[hidden] {
        display:none!important;
    }

    body.tr-native-app .tr-mobile-call-header > .tr-mobile-call-customer {
        position:absolute!important;
        top:11px!important;
        left:14px!important;
        right:50%!important;
        min-width:0!important;
        margin:0!important;
        color:#fff!important;
        font-size:1.06rem!important;
        font-weight:850!important;
        line-height:1.3!important;
        overflow-wrap:anywhere;
        text-align:left!important;
    }

    body.tr-native-app .tr-mobile-call-header > .tr-mobile-call-phone {
        position:absolute!important;
        top:11px!important;
        left:50%!important;
        right:14px!important;
        min-width:0!important;
        margin:0!important;
        color:#bceef6!important;
        font-size:.84rem!important;
        font-weight:650!important;
        line-height:1.3!important;
        overflow-wrap:anywhere;
        text-align:right!important;
    }

    body.tr-native-app .tr-mobile-call-header > .tr-mobile-call-date {
        position:absolute!important;
        top:42px!important;
        bottom:auto!important;
        left:14px!important;
        right:auto!important;
        width:auto!important;
        min-width:0!important;
        margin:0!important;
        color:#c4d1df!important;
        font-size:.74rem!important;
        font-weight:600!important;
        line-height:1.3!important;
        text-align:left!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-mobile-call-header > .tr-status {
        display:inline-flex!important;
        position:absolute!important;
        bottom:8px!important;
        left:50%!important;
        right:14px!important;
        justify-self:auto!important;
        align-self:auto!important;
        margin:0!important;
        color:#d7e6f0!important;
        background:rgba(255,255,255,.1)!important;
        border:0!important;
        font-size:.64rem!important;
    }

    body.tr-native-app .tr-mobile-call-header .tr-mobile-call-date,
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta > strong {
        left:14px!important;
        right:auto!important;
        width:auto!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-mobile-call-header > .tr-status,
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta .tr-status {
        display:inline-flex!important;
        position:absolute!important;
        top:auto!important;
        right:14px!important;
        top:46px!important;
        bottom:auto!important;
        left:auto!important;
        z-index:3!important;
    }

    /* Fallback for the original shared hero markup before mobile hydration. */
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero {
        position:relative!important;
        min-height:76px!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta {
        display:contents!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta > strong {
        position:absolute!important;
        top:46px!important;
        right:auto!important;
        bottom:auto!important;
        left:14px!important;
        width:auto!important;
        margin:0!important;
        color:#c4d1df!important;
        font-size:.74rem!important;
        font-weight:600!important;
        line-height:1.3!important;
        text-align:left!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta .tr-status {
        display:inline-flex!important;
        position:absolute!important;
        top:46px!important;
        right:14px!important;
        bottom:auto!important;
        left:auto!important;
        width:auto!important;
        margin:0!important;
        color:#d7e6f0!important;
        background:rgba(255,255,255,.1)!important;
        border:0!important;
        text-align:center!important;
    }
}

/* Staging test: place the three server-rendered call-header wrappers
 * explicitly in the native app. This is intentionally scoped away from the
 * browser portal and overrides the legacy absolute positioning above. */
@media (max-width:720px) {
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero {
        display:grid!important;
        grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
        grid-template-rows:auto auto auto!important;
        grid-template-areas:"name name" "phone date" "status status"!important;
        align-items:start!important;
        gap:3px!important;
        min-height:104px!important;
        position:relative!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-name,
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-phone,
    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta {
        display:contents!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-name > strong {
        grid-area:name!important;
        grid-column:1 / -1!important;
        grid-row:1!important;
        margin:0!important;
        max-width:100%!important;
        overflow:hidden!important;
        text-align:left!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-number {
        position:static!important;
        grid-area:phone!important;
        grid-column:1!important;
        grid-row:2!important;
        margin:0!important;
        text-align:left!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta > strong {
        position:static!important;
        grid-area:date!important;
        grid-column:2!important;
        grid-row:2!important;
        margin:0!important;
        text-align:right!important;
        white-space:nowrap!important;
    }

    body.tr-native-app .tr-employee-call-head.tr-employee-call-hero .tr-call-hero-meta .tr-status {
        display:inline-flex!important;
        position:static!important;
        grid-area:status!important;
        grid-column:2!important;
        grid-row:3!important;
        justify-self:end!important;
        margin:0!important;
    }
}
