/* Monika workspace identity. Decoration belongs to login; business surfaces
   remain neutral, opaque and consistent in both themes. */
/* Shared palette and shape tokens live in workspace.css. */
body{background:var(--ui-canvas);}
#app-shell .main-area{isolation:isolate;position:relative;background:var(--ui-canvas);}
#app-shell .main-area::before{display:none;}
#app-shell .sidebar{background:#18372a;color:#f4f0dd;border-right:1px solid #284835;}
#app-shell .sidebar-brand{border-bottom:1px solid #385641;min-height:82px;padding:19px 16px;}
#app-shell .sidebar-brand-text b{color:#f5f0dd;font-size:12px;letter-spacing:.01em;}
#app-shell .sidebar-brand-text span{color:#c4caa8;font-size:8px;letter-spacing:.17em;}
#app-shell .brand-logo-mark{background:#faf4df;border-radius:50%;width:36px;height:36px;}
#app-shell .nav-section-label{color:#b1c1a3;font-size:9px;letter-spacing:.16em;}
#app-shell .nav-link{color:#e0e8d7;border-radius:3px;transition:background 140ms,color 140ms;}
#app-shell .nav-link .ico,#app-shell .nav-link.sub .ico{color:#b3c5a2;}
#app-shell .nav-link:hover{background:#274a34;color:#fffbea;}
#app-shell .nav-link.active{background:#dce4be;color:#213e27;box-shadow:inset 3px 0 #c5a465;}
#app-shell .nav-link.active .ico{color:#315333;}
#app-shell .nav-group-toggle.nav-link{font-weight:500;}
#app-shell .nav-group-children{border-color:#36593f;}
#app-shell .sidebar-toggle{background:#24442f;border:1px solid #58704e;color:#e2e8d2;}
#app-shell .topbar{background:var(--ui-surface);min-height:72px;padding:12px 28px;}
#app-shell .topbar-title{font-size:16px;color:var(--ui-text);}
#app-shell .topbar-crumb{font-size:10px;letter-spacing:.03em;}
#app-shell .user-avatar{background:#385e3e;color:#fffbe7;border-radius:50%;}
#app-shell .topbar-right .theme-pill,#app-shell .layout-pill,#app-shell .fy-pill{border-radius:3px;}
#page-content{padding:24px 28px 36px;}
#page-content .page-header{border-color:var(--ui-border);}
#page-content .page-title,.page-context h1{letter-spacing:-.025em;}
#page-content .card{box-shadow:none;}
#page-content .table-wrap,#page-content .filter-bar{background:var(--ui-surface);}
#app-shell .btn-primary{background:var(--ui-accent);}
#app-shell .theme-btn.active,#app-shell .layout-btn.active{background:var(--ui-selected);color:var(--brand-text);}
#module-grid{gap:16px;}
#module-grid .module-card{position:relative;padding:23px 22px 18px;min-height:219px;border-radius:5px;border-color:var(--ui-border);transition:transform 180ms ease,border-color 180ms,box-shadow 180ms;}
#module-grid .module-card:hover{transform:translateY(-3px);border-color:#819568;box-shadow:0 8px 20px #22391f12;}
#module-grid .module-card:focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px;}
#module-grid .module-card-head{align-items:center;gap:12px;}
#module-grid .module-card-head b{font-size:15px;line-height:1.3;}
#module-grid .module-icon{width:38px;height:38px;flex-shrink:0;border-radius:4px;border:1px solid var(--ui-border);background:var(--ui-surface-alt);}
#module-grid .module-card-head .badge{display:none;}
#module-grid .module-card-arrow{margin-left:auto;color:var(--ui-muted);}
#module-grid .module-desc{font-size:12px;color:var(--ui-muted);margin:18px 0 16px;line-height:1.7;}
.module-footnote{display:flex;align-items:center;justify-content:space-between;margin-top:auto;border-top:1px solid var(--ui-border);padding-top:13px;font-size:10px;color:var(--brand-text);}
.module-footnote span:last-child{font-size:14px;}
.workspace-bottom-note{display:flex;justify-content:space-between;gap:15px;margin-top:26px;padding-top:18px;border-top:1px solid var(--ui-border);font-size:10px;color:var(--ui-muted);}
.workspace-bottom-note span:last-child{letter-spacing:.1em;}
#page-content.route-enter{animation:agave-page-in 220ms ease-out both;}
#app-shell[data-nav-pos=top] .sidebar{background:#18372a;}
#app-shell[data-nav-pos=top] .nav-group-children{background:#18372a;border-color:#52704a;}
#app-shell .mobile-nav-close{color:#f4f0dd;background:#23452e;border-color:#52704a;}
@keyframes agave-page-in{from{opacity:.55;transform:translateY(7px);}to{opacity:1;transform:none;}}
@media(min-width:1550px){#module-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media(max-width:1100px){#module-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.agave-home-hero::after{background:linear-gradient(90deg,#193d29ed,#193d29a6);}}
@media(max-width:760px){#app-shell .topbar{padding:12px 16px;min-height:65px;}#page-content{padding:18px 16px 28px;}.agave-home-hero::after{background:linear-gradient(90deg,#193d29ed,#193d29a8);}#module-grid .module-card{min-height:198px;padding:20px;}.workspace-bottom-note{font-size:9px;}}
@media(max-width:540px){#module-grid{grid-template-columns:minmax(0,1fr);}#module-grid .module-card{min-height:180px;}.workspace-bottom-note span:last-child{display:none;}#app-shell .main-area::before{width:330px;height:360px;}}
@media(prefers-reduced-motion:reduce){#page-content.route-enter{animation:none;}#module-grid .module-card{transition:none;}#module-grid .module-card:hover{transform:none;}}

/* Keep the drawer palette together: workspace.css also sets its mobile surface. */
@media(max-width:760px){
 #app-shell.mobile-nav-open .sidebar,#app-shell.mobile-nav-open[data-nav-pos=top] .sidebar{background:#18372a;}
 #app-shell.mobile-nav-open .mobile-nav-close{background:#23452e;color:#f4f0dd;min-height:44px;}
 #app-shell.mobile-nav-open .nav-link{min-height:44px;font-size:14px;}
 #app-shell.mobile-nav-open #sidebar-nav{overscroll-behavior:contain;}
 #app-shell.mobile-nav-open #sidebar-toggle-slot{display:none;}
 body:has(#app-shell.mobile-nav-open){overflow:hidden;}
 #app-shell .topbar,#app-shell[data-nav-pos=top] .topbar{position:relative;height:auto;padding:10px 12px;gap:10px;flex-direction:column;align-items:stretch;backdrop-filter:none;-webkit-backdrop-filter:none;}
 #app-shell .topbar-left{gap:10px;min-width:0;}
 #app-shell .topbar-left>div{min-width:0;}
 #app-shell .topbar-title,#app-shell[data-nav-pos=top] .topbar-title{font-size:15px;overflow-wrap:anywhere;}
 #app-shell .topbar-crumb,#app-shell[data-nav-pos=top] .topbar-crumb{display:block;font-size:11px;}
 #app-shell .mobile-menu{min-height:44px;flex-shrink:0;}
 #app-shell .topbar-right{display:grid;grid-template-columns:minmax(0,1fr) 90px 66px;grid-template-areas:'maintenance theme bell' 'fy fy logout';gap:6px;align-items:center;}
 #maintenance-pill-slot{grid-area:maintenance;min-width:0;}
 #maintenance-pill-slot:empty{display:none;}
 /* Desktop navigation placement has no effect on the phone drawer. */
 #app-shell #layout-pill-slot,#app-shell .topbar-right .user-chip{display:none;}
 #app-shell .topbar-right>.theme-pill{grid-area:theme;}
 #support-badge-slot{grid-area:bell;justify-self:end;}
 #app-shell .fy-pill{grid-area:fy;min-width:0;height:44px;padding:0 8px;}
 #app-shell .fy-pill select,#app-shell[data-nav-pos=top] .fy-pill select{width:100%;min-width:0;height:42px;font-size:16px;}
 #app-shell .topbar-right .theme-pill{height:44px;padding:0;gap:0;}
 #app-shell .theme-btn{width:44px;height:42px;}
 #app-shell .maintenance-pill{width:100%;min-height:44px;justify-content:center;padding:6px;font-size:12px;white-space:normal;}
 #app-shell .support-bell-pill,#app-shell[data-nav-pos=top] .support-bell-pill{width:44px;height:44px;}
 #app-shell .support-bell-pill:hover,#app-shell .maintenance-pill:hover,#module-grid .module-card:hover{transform:none;}
 #app-shell .btn-logout{grid-area:logout;height:44px;padding:6px;font-size:12px;}
 #app-shell .notif-panel{position:fixed;top:68px;left:12px;right:12px;width:auto;max-height:calc(100dvh - 90px);background:var(--ui-surface);}
 #page-content{padding:14px 12px 24px;}
 #module-grid{gap:12px;}
 #module-grid .module-card{min-height:0;padding:16px;}
 #module-grid .module-desc{margin:10px 0 12px;line-height:1.5;}
 #app-shell .main-area::before{display:none;}
 #page-content.route-enter{animation:none;}
 #page-content .header-actions{width:100%;}
 #page-content .header-actions .btn{flex:1 1 auto;}
 :is(#app-shell,#modal-root) .btn{min-height:44px;}
 :is(#app-shell,#modal-root) :is(.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea,.ss-trigger){min-height:44px;font-size:16px;}
 #page-content .tab-bar{max-width:100%;overflow-x:auto;}
 #page-content :is(.tab,.tab-btn),#page-content .sw .sw-tabs button,#page-content .sp-workspace .sp-tabs a{min-height:44px;}
 #page-content .sw :is(.sw-focus-bar,.sw-toolbar,.wg-toolbar,.sw-pager) button{min-height:44px;}
 #page-content .sw :is(.sw-toolbar,.wg-toolbar) :is(input,select){min-height:44px;font-size:16px;}
 #page-content .sw .sw-toolbar input[type=month]{min-width:190px;max-width:100%;}
 #page-content .sw .sw-tabs{flex-wrap:nowrap;overflow-x:auto;min-width:0;max-width:100%;}
 #page-content .sw .sw-tabs button{flex-shrink:0;}
}

/* A single mobile header row; optional account controls flow without role-specific gaps. */
.mobile-options{display:none;}
@media(max-width:760px){
 #app-shell .topbar,#app-shell[data-nav-pos=top] .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px;min-height:64px;padding:8px 12px;align-items:center;}
 #app-shell .topbar-left{gap:8px;}
 #app-shell .topbar-left>div{overflow:hidden;}
 #app-shell .topbar-title,#app-shell[data-nav-pos=top] .topbar-title{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
 #app-shell .topbar-crumb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
 #app-shell .mobile-options{display:inline-flex;min-height:44px;align-items:center;justify-content:center;}
 #app-shell .mobile-options[aria-expanded=true]{background:var(--ui-selected);}
 #app-shell .topbar-right{display:none;grid-column:1/-1;}
 #app-shell .options-open .topbar-right{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:12px;margin-top:8px;border-top:1px solid var(--ui-border);}
 #app-shell .topbar-right .fy-pill{order:0;flex:1 1 100%;}
 #app-shell .topbar-right .user-chip{display:flex;order:1;flex:1 1 100%;min-width:0;}
 #app-shell .topbar-right .user-meta{display:flex;flex-direction:column;gap:2px;min-width:0;}
 #app-shell .topbar-right .user-meta b{overflow-wrap:anywhere;}
 #app-shell .topbar-right>.theme-pill{order:2;flex:0 0 90px;}
 #support-badge-slot{order:3;}
 #app-shell .topbar-right .btn-logout{order:4;margin-left:auto;padding:6px 12px;}
 #maintenance-pill-slot{order:5;flex:1 1 100%;}
 #maintenance-pill-slot:not(:has(button)){display:none;}
}
