/*
 * Keravin.INTERN v1.3.0.6 – UI/UX Foundation
 * Odoo-inspired interaction model, adapted to Keravin.
 * Goal: one predictable visual language across legacy operations and ERP modules.
 */
:root{
  --kv-bg:#f6f7f8;
  --kv-surface:#ffffff;
  --kv-surface-soft:#f9fafb;
  --kv-surface-hover:#f2f4f5;
  --kv-border:#dfe3e6;
  --kv-border-strong:#cbd1d6;
  --kv-text:#20262c;
  --kv-muted:#69737c;
  --kv-primary:#35424b;
  --kv-primary-hover:#28333a;
  --kv-primary-soft:#e9eef1;
  --kv-accent:#75616f;
  --kv-accent-soft:#f1ecef;
  --kv-info:#245f8f;
  --kv-info-soft:#edf4fa;
  --kv-success:#23704a;
  --kv-success-soft:#edf7f1;
  --kv-warning:#8b6400;
  --kv-warning-soft:#fff7df;
  --kv-danger:#9d332c;
  --kv-danger-soft:#fff0ef;
  --kv-shadow-sm:0 1px 2px rgba(24,32,38,.05);
  --kv-shadow-md:0 8px 24px rgba(24,32,38,.09);
  --kv-radius:8px;
  --kv-radius-lg:11px;
  --kv-control-h:38px;
  --kv-sidebar:238px;
  --kv-topbar:64px;
  --card:var(--kv-surface);
  --surface:var(--kv-surface);
  --line:var(--kv-border);
  --success:var(--kv-success);
}

html{background:var(--kv-bg)}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--kv-bg);color:var(--kv-text);font-size:14px;line-height:1.42}
body.kv136-ui-ready{letter-spacing:.001em}
::selection{background:rgba(117,97,111,.2)}

/* Typography and rhythm */
h1,h2,h3,h4{color:var(--kv-text);letter-spacing:-.015em}
h2{font-size:1.35rem}h3{font-size:1.13rem}h4{font-size:.98rem}
.muted{color:var(--kv-muted)!important}.eyebrow{color:var(--kv-muted);font-weight:700;letter-spacing:.11em}
.small{font-size:12.5px}.tiny{font-size:11px}

/* Application chrome */
.topbar{
  position:sticky;top:0;z-index:1000;height:var(--kv-topbar);min-height:var(--kv-topbar);
  padding:8px 20px;background:rgba(255,255,255,.97);backdrop-filter:blur(9px);
  border-bottom:1px solid var(--kv-border);box-shadow:var(--kv-shadow-sm)
}
.topbar-brand{min-width:0}.topbar-brand .shortlogo{width:38px;height:38px}
.topbar-brand .eyebrow{font-size:10px;margin:0}.topbar-brand h1{font-size:17px;margin:1px 0 0;font-weight:760}
.userbox{gap:8px}.userbox>div{line-height:1.2}.userbox strong{font-size:13px}.language-compact select{margin:0;min-height:34px;padding:6px 26px 6px 9px}

@media(min-width:700px){
  #appView{--keravin-side-nav:var(--kv-sidebar)!important}
  #mainNav.nav{
    top:var(--kv-topbar)!important;width:var(--kv-sidebar)!important;padding:10px 8px 16px!important;gap:2px!important;
    background:#fbfbfc!important;border-right:1px solid var(--kv-border)!important;box-shadow:none!important;overflow-y:auto!important;overflow-x:hidden!important
  }
  #appView>main.container,#appView>#devBanner{
    margin-left:calc(var(--kv-sidebar) + 8px)!important;width:calc(100% - var(--kv-sidebar) - 16px)!important
  }
  #appView>main.container{padding:12px 22px 32px!important}
}

/* Sidebar navigation: stable, compact, predictable */
#mainNav .navbtn{
  position:relative;display:flex;align-items:center!important;gap:9px!important;width:100%;min-height:36px!important;
  padding:7px 10px!important;border:1px solid transparent!important;border-radius:7px!important;background:transparent!important;
  color:#4d5861!important;font-size:13px!important;font-weight:590!important;line-height:1.15;transition:background .12s,border-color .12s,color .12s
}
/* Permission and responsive visibility must win over navigation presentation. */
#mainNav .navbtn.hidden,#mainNav .navbtn[hidden]{display:none!important}
#mainNav .navbtn:hover{background:var(--kv-surface-hover)!important;color:var(--kv-text)!important}
#mainNav .navbtn.active{background:var(--kv-accent-soft)!important;border-color:rgba(117,97,111,.16)!important;color:#513f4b!important;font-weight:750!important;box-shadow:inset 3px 0 0 var(--kv-accent)}
#mainNav .navbtn .nav-badge{margin-left:auto!important}
#mainNav .navbtn[data-kv-icon]::before{content:attr(data-kv-icon);display:grid;place-items:center;width:18px;min-width:18px;height:18px;font-size:14px;line-height:1;opacity:.86}
#mainNav .navbtn[data-nav-group="communication"]{color:#53606a!important}
#mainNav .navbtn[data-nav-group="admin"]{color:#59636b!important}
#mainNav .navbtn[data-nav-group="admin"]:first-of-type{margin-top:5px}
.erp120-beta{font-size:9px!important;padding:1px 5px!important;border-radius:999px!important;background:var(--kv-primary-soft)!important;color:var(--kv-muted)!important;margin-left:auto!important}

/* Context / breadcrumb bar */
.kv136-contextbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;margin:0 0 10px;padding:0 2px;border-bottom:1px solid var(--kv-border)}
.kv136-context-main{display:flex;align-items:center;min-width:0;gap:7px}.kv136-context-root{color:var(--kv-muted);font-size:12px}.kv136-context-sep{color:#a4abb1}.kv136-context-title{font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kv136-context-meta{font-size:11px;color:var(--kv-muted);white-space:nowrap}

/* Surfaces: less "card wall", more workspace */
.card,.erp133-panel,.erp120-panel{
  background:var(--kv-surface)!important;border:1px solid var(--kv-border)!important;border-radius:var(--kv-radius-lg)!important;
  box-shadow:var(--kv-shadow-sm);padding:16px!important;margin-bottom:12px!important
}
.card .card,.erp133-panel .card{box-shadow:none}
.section-head,.erp133-module-head{margin-bottom:12px!important}
.section-head h2,.section-head h3,.erp133-module-head h3{margin-bottom:3px}
.erp133-module-head{padding:2px 1px 10px;border-bottom:1px solid var(--kv-border)}
.erp133-module-head p{max-width:900px}

/* Buttons – one semantic system everywhere */
button,.primary,.secondary,.danger,.rangebtn{
  font-family:inherit;transition:background .12s,border-color .12s,color .12s,box-shadow .12s,transform .04s;
  -webkit-tap-highlight-color:transparent
}
.primary,.secondary,.danger,.rangebtn,.kv136-button,dialog .actions button,.erp133-module-actions button,.erp135-toolbar button{
  min-height:var(--kv-control-h);display:inline-flex;align-items:center;justify-content:center;gap:7px;
  border-radius:6px!important;padding:7px 12px!important;font-size:13px!important;font-weight:700!important;line-height:1.1;white-space:nowrap
}
.primary{
  background:var(--kv-primary)!important;color:#fff!important;border:1px solid var(--kv-primary)!important;box-shadow:0 1px 1px rgba(0,0,0,.05)
}
.primary:hover{background:var(--kv-primary-hover)!important;border-color:var(--kv-primary-hover)!important}
.secondary,.rangebtn,.kv136-button{
  background:var(--kv-surface)!important;color:var(--kv-text)!important;border:1px solid var(--kv-border-strong)!important;box-shadow:none
}
.secondary:hover,.rangebtn:hover,.kv136-button:hover{background:var(--kv-surface-hover)!important;border-color:#b8c0c6!important}
.secondary.active,.rangebtn.active,.erp120-tabs .secondary.active,.erp135-subtabs .secondary.active{
  background:var(--kv-accent-soft)!important;color:#513f4b!important;border-color:rgba(117,97,111,.42)!important;box-shadow:none!important;outline:0!important
}
.danger{background:var(--kv-danger)!important;color:#fff!important;border:1px solid var(--kv-danger)!important}
.danger:hover{background:#842a25!important;border-color:#842a25!important}
button:disabled,.primary:disabled,.secondary:disabled,.danger:disabled{opacity:.52!important;cursor:not-allowed!important;transform:none!important}
button:active:not(:disabled){transform:translateY(1px)}
button[data-kv-action="new"]::before{content:"＋"}button[data-kv-action="save"]::before{content:"✓"}button[data-kv-action="delete"]::before{content:"×"}button[data-kv-action="edit"]::before{content:"✎"}button[data-kv-action="open"]::before{content:"›"}button[data-kv-action="pdf"]::before{content:"▤"}button[data-kv-action="back"]::before{content:"←"}button[data-kv-action="search"]::before{content:"⌕"}
button[data-kv-action]::before{font-weight:800;line-height:1;opacity:.82}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid rgba(117,97,111,.22)!important;outline-offset:2px!important}

/* Keep text/link style actions light */
.openlink,.hours-link,.jobrow button,.gallery-thumb{min-height:auto!important;border-radius:0!important}
.gold-star-button{min-height:34px!important}

/* Inputs & forms */
input,select,textarea{
  min-height:var(--kv-control-h);margin-top:5px;padding:8px 10px;border:1px solid var(--kv-border-strong);border-radius:6px;
  background:var(--kv-surface);color:var(--kv-text);font:inherit;box-shadow:inset 0 1px 1px rgba(0,0,0,.015);transition:border-color .12s,box-shadow .12s
}
textarea{min-height:82px;line-height:1.4}
input:hover,select:hover,textarea:hover{border-color:#b9c1c7}
input:focus,select:focus,textarea:focus{border-color:rgba(117,97,111,.72);box-shadow:0 0 0 3px rgba(117,97,111,.10);outline:0}
label{color:#4c565f;font-weight:600}.stack-form label,.form-grid label,dialog label{font-size:12.5px}
.form-grid{gap:10px 12px}

/* Odoo-inspired list toolbar and tabs */
.erp120-tabs-card{padding:0!important;overflow:hidden}
.erp120-tabs,.erp133-module-tabs{
  display:flex!important;flex-wrap:nowrap!important;gap:0!important;align-items:stretch!important;overflow-x:auto;padding:0 10px!important;
  border-bottom:1px solid var(--kv-border);background:var(--kv-surface-soft);scrollbar-width:thin
}
.erp120-tabs .secondary,.erp133-module-tabs .secondary{
  min-height:42px!important;margin:0!important;padding:8px 11px!important;border:0!important;border-bottom:2px solid transparent!important;
  border-radius:0!important;background:transparent!important;color:var(--kv-muted)!important;box-shadow:none!important
}
.erp120-tabs .secondary:hover,.erp133-module-tabs .secondary:hover{background:rgba(0,0,0,.025)!important;color:var(--kv-text)!important}
.erp120-tabs .secondary.active,.erp133-module-tabs .secondary.active{
  background:transparent!important;color:#513f4b!important;border-bottom-color:var(--kv-accent)!important;font-weight:780!important
}
.erp120-tab-body{padding:16px!important}

.erp135-toolbar,.erp133-search{gap:7px!important;margin:8px 0 12px!important;padding:0}
.erp135-toolbar .grow,.erp133-search input{min-height:var(--kv-control-h)}
.erp135-filters{border:1px solid var(--kv-border)!important;border-radius:7px!important;background:var(--kv-surface-soft)!important;padding:9px!important;gap:9px!important}

/* Tables – consistent data workspace */
.erp135-table-wrap,.planning-board{
  border:1px solid var(--kv-border)!important;border-radius:7px!important;background:var(--kv-surface)!important;box-shadow:none!important
}
.erp135-table{font-size:13px}
.erp135-table th{
  height:38px;padding:8px 10px!important;background:#f6f7f8!important;color:#59636b;font-size:11.5px!important;font-weight:760!important;
  letter-spacing:.018em;text-transform:none;border-bottom:1px solid var(--kv-border)!important
}
.erp135-table td{padding:8px 10px!important;border-bottom:1px solid #edf0f2!important}
.erp135-table tbody tr:hover{background:#f8f9fa!important}
.erp135-table tbody tr.is-selected{background:var(--kv-accent-soft)!important;box-shadow:inset 3px 0 0 var(--kv-accent)}
.erp135-table tbody tr:last-child td{border-bottom:0!important}

/* KPI / Smart-button language */
.erp133-kpi-grid,.erp135-card-grid{gap:8px!important}
.erp133-kpi,.erp135-card{
  border:1px solid var(--kv-border)!important;border-radius:7px!important;background:var(--kv-surface)!important;padding:10px 11px!important;box-shadow:none!important
}
.erp133-kpi small,.erp135-card small{color:var(--kv-muted)!important;opacity:1!important;font-size:11.5px}
.erp133-kpi b,.erp135-card b{font-size:1.05rem!important;font-weight:780}
.kv136-smartbtn{cursor:pointer!important;text-align:left!important;transition:background .12s,border-color .12s}
.kv136-smartbtn:hover{background:var(--kv-surface-hover)!important;border-color:#c8ced3!important}

/* Statuses never rely on color alone */
.erp135-status,.pill,.erp133-badge{
  display:inline-flex;align-items:center;gap:5px;border:1px solid var(--kv-border)!important;border-radius:999px!important;
  padding:3px 7px!important;font-size:11.5px!important;font-weight:700!important;line-height:1.2;white-space:nowrap;background:#f1f3f4;color:#59636b
}
.erp135-status.is-success,.goodbox{background:var(--kv-success-soft)!important;color:var(--kv-success)!important;border-color:#bcdcca!important}
.erp135-status.is-info{background:var(--kv-info-soft)!important;color:var(--kv-info)!important;border-color:#c6dbea!important}
.erp135-status.is-warning,.warn{background:var(--kv-warning-soft)!important;color:var(--kv-warning)!important;border-color:#ead99b!important}
.erp135-status.is-error,.erp135-status.is-locked{background:var(--kv-danger-soft)!important;color:var(--kv-danger)!important;border-color:#edc4c0!important}

/* Empty, notice, danger and success blocks */
.erp133-empty,.empty{
  color:var(--kv-muted)!important;padding:18px!important;border:1px dashed #d4d9dd!important;border-radius:7px!important;background:#fafbfb;text-align:center
}
.erp135-alert-box{border-color:#ead99b!important;background:var(--kv-warning-soft)!important;border-radius:7px!important}
.erp135-danger-box,.dangerzone{border-color:#edc4c0!important;background:var(--kv-danger-soft)!important;border-radius:7px!important}
.erp135-ok-box,.goodbox{border-radius:7px!important}
.message{color:var(--kv-danger);font-weight:600}

/* Toasts / notifications */
.erp135-notice-stack{top:74px!important;right:16px!important;width:min(400px,calc(100vw - 24px))!important;gap:7px!important}
.erp135-notice{
  grid-template-columns:28px 1fr 26px!important;gap:8px!important;padding:10px!important;border-width:1px!important;border-left-width:4px!important;
  border-radius:8px!important;box-shadow:var(--kv-shadow-md)!important
}
.erp135-notice-icon{width:26px!important;height:26px!important;font-size:12px!important}
.erp135-notice-copy strong{font-size:12.5px}.erp135-notice-copy span{font-size:12px!important;color:#4f5962}

/* Dialogs */
dialog{border:1px solid rgba(0,0,0,.08)!important;border-radius:10px!important;padding:18px!important;background:var(--kv-surface)!important;color:var(--kv-text);box-shadow:0 24px 70px rgba(24,32,38,.23)!important}
dialog::backdrop{background:rgba(31,38,44,.48)!important;backdrop-filter:blur(1px)}
dialog .actions{padding-top:12px;border-top:1px solid var(--kv-border)}
#v133PdfDialog{padding:0!important;border-radius:10px!important}

/* Lists and detail panes */
.erp135-split{gap:12px!important}.erp135-detail{top:76px!important}
.erp135-list{gap:5px!important}.erp135-list-item{
  border:1px solid var(--kv-border)!important;border-radius:7px!important;padding:9px 10px!important;background:var(--kv-surface)!important
}
button.erp135-list-item:hover{background:var(--kv-surface-hover)!important}
.erp135-location-grid{gap:12px!important}.erp135-location-btn{border-radius:6px!important}
.erp133-launch-grid{gap:8px!important}.erp133-launch{
  min-height:78px!important;padding:12px!important;border:1px solid var(--kv-border)!important;border-radius:7px!important;background:var(--kv-surface)!important;box-shadow:none!important
}
.erp133-launch:hover{background:var(--kv-surface-hover)!important;transform:none!important;border-color:#c8ced3!important}

/* Login */
.login-shell{background:linear-gradient(180deg,#f7f8f9,#eef1f3)}
.login-card{border-color:var(--kv-border)!important;border-radius:12px!important;padding:30px!important;box-shadow:0 18px 55px rgba(24,32,38,.10)!important}
.login-card .brand{font-size:25px}.login-card h1{font-size:21px}


/* Legacy operational surfaces adopt the same workspace language */
.info-box,.metric,.calcgrid>div,.job-hours-summary>div,.overtime-balance-details>div,.overtime-balance-audit>div{background:var(--kv-surface-soft)!important;border:1px solid #edf0f2;border-radius:7px!important}
.attention{border:1px solid var(--kv-border)!important;border-left:4px solid #a8b0b6!important;background:var(--kv-surface)!important;border-radius:7px!important;transition:background .12s,border-color .12s}
.attention:hover{background:var(--kv-surface-hover)!important}.attention.high{border-left-color:var(--kv-danger)!important;background:var(--kv-danger-soft)!important}.attention.normal{border-left-color:var(--kv-warning)!important}
.status-filter,.room-filter,.team-employee-filter{background:var(--kv-surface-soft)!important;border:1px solid var(--kv-border)!important;border-radius:7px!important}
.filetile{border-color:var(--kv-border)!important;border-radius:7px!important;background:var(--kv-surface)!important;box-shadow:none!important}.filetile:hover{border-color:#c5ccd1!important;background:var(--kv-surface-hover)!important}
.jobrow,.reminderrow,.teamrow,.requestrow,.noterow,.followrow,.absrow,.phaserow,.variationrow,.issuerow{border-color:#edf0f2!important}
.nav-badge{background:var(--kv-danger)!important;font-weight:760!important}

/* Progress / busy affordance */
[aria-busy="true"]{position:relative;cursor:wait!important}
[aria-busy="true"]::after{content:"";width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:kv136spin .65s linear infinite;opacity:.75}
@keyframes kv136spin{to{transform:rotate(360deg)}}

/* Mobile: Odoo-like bottom navigation remains compact, content becomes edge-to-edge */
@media(max-width:699px){
  :root{--kv-topbar:58px}
  .topbar{height:auto;min-height:58px;padding:7px 10px}.topbar-brand h1{display:none}.topbar-brand .shortlogo{width:34px;height:34px}.topbar-brand .eyebrow{font-size:10px}
  .userbox{gap:5px}.userbox>div{display:none}.userbox .secondary{min-height:34px!important;padding:6px 8px!important;font-size:11.5px!important}
  #mainNav.nav{background:rgba(255,255,255,.98)!important;border-top-color:var(--kv-border)!important;box-shadow:0 -4px 16px rgba(24,32,38,.08)!important}
  #mainNav .navbtn{min-height:48px!important;padding:4px 3px!important;gap:2px!important;flex-direction:column!important;font-size:10.5px!important;text-align:center!important}
  #mainNav .navbtn.active{box-shadow:inset 0 3px 0 var(--kv-accent)!important}
  #mainNav .navbtn[data-kv-icon]::before{font-size:15px}
  #appView>main.container{padding:10px 10px 16px!important}
  .kv136-contextbar{min-height:36px;margin-bottom:8px}.kv136-context-root,.kv136-context-sep,.kv136-context-meta{display:none}.kv136-context-title{font-size:13px}
  .card,.erp133-panel,.erp120-panel{padding:12px!important;border-radius:8px!important;margin-bottom:9px!important}
  .erp120-tab-body{padding:10px!important}.erp120-tabs .secondary,.erp133-module-tabs .secondary{min-height:39px!important;padding:7px 9px!important;font-size:12px!important}
  .erp135-notice-stack{top:64px!important;right:8px!important;width:calc(100vw - 16px)!important}
  .erp135-detail{top:auto!important}.erp133-kpi-grid,.erp135-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}