/* ==========================================================================
   Nortons Hiab Services - Admin Control Panel
   admin.css - self-hosted, no Bootstrap, websafe fonts only
   Neutral / minimal UI with Nortons blue accents.
   Redefines the legacy class/id names so existing page markup needs no rewrite
   ========================================================================== */

:root{
  --blue:#003399;
  --blue-dark:#00246b;
  --blue-600:#1e50b4;
  --blue-tint:#eef2fb;
  --yellow:#f2b705;
  --yellow-tint:#fff7e0;
  --ink:#1f2733;
  --muted:#5b6675;
  --faint:#8a94a4;
  --line:#e3e7ee;
  --line-strong:#cbd3df;
  --bg:#f4f6f9;
  --card:#ffffff;
  --ok:#1f9d55;
  --sidebar-w:236px;
  --radius:8px;
  --shadow:0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.05);
  --font:"Segoe UI",Roboto,-apple-system,BlinkMacSystemFont,Arial,Helvetica,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:14px;line-height:1.5;color:var(--ink);background:var(--bg);}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* ---------- Layout wrapper ---------- */
#wrapper{min-height:100vh}
#page-wrapper{margin-left:var(--sidebar-w);padding:24px clamp(16px,3vw,32px) 48px;min-height:100vh;}

/* ---------- Sidebar ---------- */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-w);background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:1000;overflow-y:auto;overscroll-behavior:contain;}
.sidebar__brand{display:flex;align-items:center;gap:10px;padding:16px 18px;background:var(--blue);color:#fff;font-weight:600;letter-spacing:.2px;position:sticky;top:0;z-index:2;}
.sidebar__brand:hover{text-decoration:none;color:#fff}
.sidebar__brand svg{flex:0 0 auto}
.sidebar__brand span{font-size:14px;line-height:1.15}
.sidebar__brand small{display:block;font-size:11px;font-weight:400;opacity:.8}

.side-menu{list-style:none;margin:0;padding:8px 0 24px}
.side-menu>li{margin:0}
.side-menu a{display:flex;align-items:center;gap:10px;padding:9px 18px;color:var(--ink);font-size:13.5px;border-left:3px solid transparent;}
.side-menu a:hover{background:var(--blue-tint);text-decoration:none}
.side-menu a.is-active{background:var(--blue-tint);border-left-color:var(--blue);color:var(--blue);font-weight:600;}
.side-menu a svg{flex:0 0 18px;color:var(--faint)}
.side-menu a:hover svg,.side-menu a.is-active svg{color:var(--blue)}

.side-menu details{border-top:1px solid var(--line)}
.side-menu details:first-of-type{border-top:none}
.side-menu summary{display:flex;align-items:center;gap:10px;padding:10px 18px;cursor:pointer;font-size:13px;font-weight:600;color:var(--muted);list-style:none;user-select:none;}
.side-menu summary::-webkit-details-marker{display:none}
.side-menu summary:hover{background:#f7f9fc}
.side-menu summary .chev{margin-left:auto;transition:transform .15s ease;color:var(--faint)}
.side-menu details[open]>summary .chev{transform:rotate(90deg)}
.side-menu details[open]>summary{color:var(--blue)}
.side-menu .submenu{list-style:none;margin:0;padding:2px 0 8px}
.side-menu .submenu a{padding:7px 18px 7px 46px;font-size:13px;color:var(--muted)}
.side-menu .submenu a:hover{color:var(--blue)}

/* ---------- Topbar (mobile) ---------- */
.topbar{display:none}

/* ---------- Page header ---------- */
.page-header{margin:0 0 20px;padding:0 0 14px;border-bottom:1px solid var(--line);font-size:20px;font-weight:600;color:var(--ink);text-transform:none;}
h1.page-header{font-size:20px}

/* ---------- Simple grid (replaces bootstrap grid used by pages) ---------- */
.row{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 16px}
.row:last-child{margin-bottom:0}
[class*="col-"]{flex:1 1 100%;min-width:0}
.col-lg-6,.col-md-6{flex:1 1 calc(50% - 8px)}
.col-lg-12{flex:1 1 100%}
.col-xs-6{flex:1 1 50%}
.col-xs-12{flex:1 1 100%}
.text-right{text-align:right}
.pull-left{float:left}
.pull-right{float:right}
.clearfix::after{content:"";display:table;clear:both}
@media(max-width:640px){.col-lg-6,.col-md-6{flex:1 1 100%}}

/* ---------- Dashboard cards (replaces .panel) ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:16px;}
.stat-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;}
.stat-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(16,24,40,.10);text-decoration:none;border-color:var(--line-strong)}
.stat-card__body{display:flex;align-items:center;gap:12px;padding:16px}
.stat-card__icon{flex:0 0 44px;height:44px;width:44px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:var(--blue-tint);color:var(--blue);}
.stat-card__thumb{flex:0 0 62px;width:62px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:#fff;border:1px solid var(--line);overflow:hidden;padding:5px;}
.stat-card__thumb img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.stat-card__label{font-size:15px;font-weight:600;color:var(--ink)}
.stat-card__foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#fafbfd;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);}
.stat-card--yellow .stat-card__icon{background:var(--yellow-tint);color:#b5820a}
.section-title{margin:26px 0 12px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);}

/* ---------- Data table panel ---------- */
#cabin_form:empty{display:none}
#cabin_table_list{width:100%;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;}

.dt-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:#fafbfd;}
.dt-search{position:relative;flex:1 1 260px;max-width:360px}
.dt-search input{width:100%;padding:8px 12px 8px 34px;border:1px solid var(--line-strong);border-radius:6px;font:inherit;font-size:13px;color:var(--ink);background:#fff;}
.dt-search input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,51,153,.12)}
.dt-search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--faint)}
.dt-count{font-size:12.5px;color:var(--muted);margin-left:auto}
.dt-perpage{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
.dt-perpage select{padding:5px 8px;border:1px solid var(--line-strong);border-radius:6px;font:inherit;font-size:12.5px;background:#fff}

.table-scroll{width:100%;overflow-x:auto}

table.table,table.wos-tableSort{width:100% !important;float:none !important;border-collapse:collapse;font-size:13px;}
.table thead th,.wos-tableSort thead th{position:sticky;top:0;background:var(--blue);color:#fff;text-align:left;font-weight:600;font-size:12px;letter-spacing:.02em;padding:10px 12px;white-space:nowrap;border-bottom:2px solid var(--blue-dark);}
.thead-dark th{background:var(--blue);color:#fff}
.wos-tableSort thead th[data-sortable]{cursor:pointer;user-select:none;padding-right:24px}
.wos-tableSort thead th .dt-arrow{opacity:.35;margin-left:6px;font-size:10px}
.wos-tableSort thead th.dt-asc .dt-arrow,.wos-tableSort thead th.dt-desc .dt-arrow{opacity:1}
.table tbody td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink);}
.table tbody tr:nth-child(even){background:#fafbfd}
.table tbody tr:hover{background:var(--blue-tint)}

.norm,.norm2,.normb,.normn,.norme,.normc,.normi{border:none !important;font-size:13px;text-align:left;padding:9px 12px;color:var(--ink);}
.normi{color:var(--faint);font-variant-numeric:tabular-nums;white-space:nowrap}
.normn{font-weight:600}
.norme{color:var(--blue);word-break:break-word}
.normc{color:var(--muted);min-width:220px}
.normb{font-weight:600}

/* message / comments: clamp to 4 lines with click-to-expand (set by admin-table.js) */
td.normc .clamp-inner{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;}
td.normc.dt-open .clamp-inner{-webkit-line-clamp:unset;display:block;overflow:visible}
.clamp-toggle{display:none;margin-top:5px;padding:0;background:none;border:none;font:inherit;font-size:11.5px;font-weight:600;color:var(--blue);cursor:pointer;}
.clamp-toggle:hover{text-decoration:underline}
td.normc.is-clampable .clamp-toggle,td.normc.dt-open .clamp-toggle{display:inline-block}

/* ---------- Pagination (injected) ---------- */
.dt-pager{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:12px 16px;border-top:1px solid var(--line);background:#fafbfd;}
.dt-pager button{min-width:34px;height:34px;padding:0 10px;border:1px solid var(--line-strong);background:#fff;border-radius:6px;font:inherit;font-size:13px;color:var(--ink);cursor:pointer;}
.dt-pager button:hover:not(:disabled){border-color:var(--blue);color:var(--blue)}
.dt-pager button.is-current{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
.dt-pager button:disabled{opacity:.45;cursor:default}
.dt-pager .dt-gap{padding:0 4px;color:var(--faint)}

/* ---------- Footer ---------- */
.page-footer{margin-left:var(--sidebar-w);padding:16px 24px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px;text-align:center;background:#fff;}

/* ---------- Login ---------- */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#00246b,#003399 60%,#1e50b4);padding:24px;}
.login-card{width:100%;max-width:360px;background:#fff;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.25);overflow:hidden;}
.login-card__head{padding:26px 28px 18px;text-align:center;border-bottom:1px solid var(--line)}
.login-card__head img{max-height:64px;width:auto;margin-bottom:10px}
.login-card__head h1{margin:0;font-size:17px;color:var(--ink)}
.login-card__head p{margin:4px 0 0;font-size:12.5px;color:var(--muted)}
.login-card form{padding:22px 28px 28px}
.login-field{margin-bottom:16px}
.login-field label{display:block;font-size:12.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.login-field input{width:100%;padding:10px 12px;font:inherit;font-size:14px;border:1px solid var(--line-strong);border-radius:7px;background:#fff;}
.login-field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,51,153,.14)}
.login-btn{width:100%;padding:11px;border:none;border-radius:7px;background:var(--blue);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;}
.login-btn:hover{background:var(--blue-dark)}
.login-error{background:#fdecec;color:#b42318;border:1px solid #f6c9c4;padding:9px 12px;border-radius:7px;font-size:13px;margin-bottom:16px;text-align:center;}

/* ---------- Responsive: collapse sidebar ---------- */
@media(max-width:900px){
  :root{--sidebar-w:0px}
  .topbar{display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:900;background:var(--blue);color:#fff;padding:10px 14px;}
  .topbar__title{font-weight:600;font-size:15px}
  .topbar__toggle{background:rgba(255,255,255,.15);border:none;color:#fff;width:38px;height:38px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
  .sidebar{transform:translateX(-100%);width:260px;transition:transform .2s ease;box-shadow:0 0 40px rgba(0,0,0,.3);}
  body.nav-open .sidebar{transform:translateX(0)}
  body.nav-open .nav-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:999;}
  #page-wrapper{margin-left:0;padding:16px}
  .page-footer{margin-left:0}
}

/* ---------- Cross-year search pages (hiabs-search / cabins-search / sell-search) ---------- */
.yr-search{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 18px;padding:14px 16px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);}
.yr-search__box{position:relative;flex:1 1 320px;max-width:460px}
.yr-search__box svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint)}
.yr-search__box input{width:100%;padding:10px 12px 10px 36px;border:1px solid var(--line-strong);border-radius:7px;font:inherit;font-size:14px;color:var(--ink);background:#fff;}
.yr-search__box input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,51,153,.12)}
.yr-search__year{padding:10px 12px;border:1px solid var(--line-strong);border-radius:7px;font:inherit;font-size:13.5px;background:#fff;color:var(--ink);}
.yr-search__year:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,51,153,.12)}
.yr-search__go{padding:10px 22px;border:none;border-radius:7px;background:var(--blue);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;}
.yr-search__go:hover{background:var(--blue-dark)}
.yr-search__clear{padding:10px 6px;font-size:13px;color:var(--muted)}
.yr-search__clear:hover{color:var(--blue)}
.yr-search__hint{color:var(--muted);font-size:14px;line-height:1.55;background:var(--blue-tint);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;max-width:760px;}
.yr-search__hint strong{color:var(--ink)}
.yr-search__result{padding:12px 16px;border-bottom:1px solid var(--line);background:#fafbfd;font-size:13px;color:var(--muted);}
.yr-search__result strong{color:var(--ink)}
@media(max-width:640px){.yr-search__box{flex:1 1 100%;max-width:none}.yr-search__go{flex:1 1 auto}}