/* Hotel Kimininga Cloud v36 — shared authenticated form / transaction design system */
:root {
  --hk-bg-main:#06182b;
  --hk-bg-panel:#0a2239;
  --hk-bg-panel-2:#0d2944;
  --hk-bg-input:#071a2d;
  --hk-teal:#22c7b5;
  --hk-teal-dark:#169b91;
  --hk-gold:#d8a72e;
  --hk-success:#29c982;
  --hk-warning:#e6b83f;
  --hk-danger:#ef4444;
  --hk-text-primary:#f4f7fb;
  --hk-text-secondary:#aab8c8;
  --hk-border:rgba(91,154,196,.35);
  --hk-sidebar-w:272px;
}

/* Only authenticated operational/form screens. Login/dashboard/division pages are intentionally excluded. */
body.hk-form-mode {
  background:#06182b;
  color:var(--hk-text-primary);
  overflow:hidden;
}
body.hk-form-mode #appView.hk-form-mode {
  display:grid;
  grid-template-columns:var(--hk-sidebar-w) minmax(0,1fr);
  height:100vh;
  min-height:0;
  background:
    linear-gradient(rgba(3,14,27,.92),rgba(4,18,33,.95)),
    url('assets/login-hotel-bg.png') center/cover fixed no-repeat;
}
body.hk-form-mode #appView.hk-form-mode > .workspace {
  min-width:0;
  min-height:0;
  height:100vh;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:transparent !important;
}
body:not(.hk-form-mode) #hkSidebar { display:none !important; }

/* Sidebar */
#hkSidebar {
  width:var(--hk-sidebar-w);
  height:100vh;
  min-height:0;
  display:flex;
  flex-direction:column;
  background:linear-gradient(180deg,rgba(5,20,37,.985),rgba(4,15,29,.985));
  border-right:1px solid rgba(66,137,174,.28);
  box-shadow:16px 0 40px rgba(0,0,0,.18);
  z-index:30;
}
.hk-side-brand {
  display:flex;
  align-items:center;
  gap:12px;
  padding:18px 16px 14px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hk-side-brand img { width:46px;height:60px;object-fit:contain;filter:drop-shadow(0 5px 9px rgba(0,0,0,.28)); }
.hk-side-brand strong { display:block;color:#fff;font-family:Georgia,serif;font-size:17px;letter-spacing:.025em;line-height:1.05; }
.hk-side-brand span { display:block;margin-top:3px;color:#e4b844;font-weight:800;font-size:12px; }
.hk-sidebar-nav { flex:1;min-height:0;overflow:auto;padding:12px 10px 16px;scrollbar-width:thin;scrollbar-color:#27546e transparent; }
.hk-side-group { margin-top:7px;border-radius:12px;overflow:hidden; }
.hk-side-group-head,.hk-side-link {
  width:100%;border:0;background:transparent;color:#c6d3df;display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;
  transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.hk-side-group-head { min-height:42px;padding:0 10px;font-size:12px;font-weight:800; }
.hk-side-group-head b { margin-left:auto;color:#708da5;transition:transform .2s ease; }
.hk-side-group.open .hk-side-group-head b { transform:rotate(180deg); }
.hk-side-icon { width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:rgba(34,199,181,.09);color:#55d8ca;font-weight:900;flex:0 0 auto; }
.hk-side-group-items { display:none;padding:3px 4px 7px 38px; }
.hk-side-group.open .hk-side-group-items { display:grid;gap:2px; }
.hk-side-link { min-height:37px;padding:0 10px;border-radius:9px;font-size:12px;font-weight:700; }
.hk-sidebar-nav > .hk-side-link { margin-bottom:6px; }
.hk-side-link:hover,.hk-side-group-head:hover { color:#fff;background:rgba(255,255,255,.055);transform:translateX(1px); }
.hk-side-link.active { color:#fff;background:linear-gradient(135deg,#149b90,#1eb9ab);box-shadow:0 8px 18px rgba(12,139,129,.22),inset 0 0 0 1px rgba(114,242,227,.28); }
.hk-side-link.active .hk-side-icon { color:#08766f;background:#fff; }
.hk-sidebar-user { margin:10px;padding:13px 14px;border-radius:14px;border:1px solid rgba(216,167,46,.23);background:linear-gradient(135deg,rgba(216,167,46,.08),rgba(255,255,255,.025)); }
.hk-sidebar-user small { display:block;color:#a9bac8;font-size:11px; }
.hk-sidebar-user strong { display:block;color:#fff;margin-top:3px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.hk-sidebar-user span { display:block;color:#e3b64a;margin-top:2px;font-size:11px;font-weight:800; }

/* Existing topbar becomes the consistent compact page header */
body.hk-form-mode .topbar {
  min-height:66px;padding:10px 18px;border-bottom:1px solid rgba(98,153,190,.22) !important;
  background:rgba(5,19,35,.88) !important;backdrop-filter:blur(12px);box-shadow:0 10px 24px rgba(0,0,0,.12);
}
body.hk-form-mode .topbar-left h3 { color:#fff !important;font-size:21px !important;margin:0 !important;font-weight:800 !important; }
body.hk-form-mode #licenseHint { color:#8095a7 !important;font-size:10px !important; }
body.hk-form-mode .workspace-brand-banner { display:none !important; }
body.hk-form-mode .top-actions button {
  min-height:38px !important;border-radius:11px !important;border:1px solid rgba(88,148,188,.28) !important;background:#0c2841 !important;color:#d9e7f1 !important;box-shadow:none !important;font-size:12px !important;font-weight:800 !important;
}
body.hk-form-mode .top-actions button:hover { border-color:rgba(34,199,181,.65) !important;color:#fff !important;transform:translateY(-1px); }
body.hk-form-mode #logoutBtn { border-color:rgba(239,68,68,.38) !important;color:#ff9292 !important;background:rgba(105,20,26,.22) !important; }
body.hk-form-mode #operationsHomeBtn { border-color:rgba(216,167,46,.35) !important;color:#f3cf70 !important; }

/* Main content */
body.hk-form-mode #content.content {
  height:auto !important;min-height:0;overflow:auto !important;padding:18px !important;background:transparent !important;scrollbar-width:thin;scrollbar-color:#27546e transparent;
}
body.hk-form-mode #content > * { max-width:1500px;margin-left:auto;margin-right:auto; }
body.hk-form-mode .department-context-bar {
  border:1px solid rgba(34,199,181,.24) !important;border-radius:13px !important;background:rgba(5,27,43,.82) !important;color:#c5d6e3 !important;padding:9px 12px !important;margin-bottom:12px !important;
}
body.hk-form-mode .department-context-bar button { color:#62dfd1 !important;background:transparent !important;border:0 !important;font-weight:800 !important; }

/* Shared premium panels */
body.hk-form-mode .form-card,
body.hk-form-mode .table-card,
body.hk-form-mode fieldset,
body.hk-form-mode .hotel-doc-form-card,
body.hk-form-mode .hotel-doc-register-card,
body.hk-form-mode .active-stays-card,
body.hk-form-mode .checkinout-action-bar,
body.hk-form-mode .reservation-list-panel {
  border:1px solid var(--hk-border) !important;border-radius:18px !important;
  background:linear-gradient(145deg,rgba(8,31,53,.97),rgba(7,24,43,.97)) !important;
  color:var(--hk-text-primary) !important;
  box-shadow:0 14px 32px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.035) !important;
}
body.hk-form-mode .form-card { padding:20px !important; }
body.hk-form-mode .two-col { gap:16px !important;align-items:start; }
body.hk-form-mode .form-card h2,body.hk-form-mode .form-card h3,body.hk-form-mode .section-head-row h3,body.hk-form-mode .hotel-doc-hero h3 { color:#fff !important; }
body.hk-form-mode .muted,body.hk-form-mode .small,body.hk-form-mode .form-help { color:#9fb0bf !important; }
body.hk-form-mode .eyebrow,body.hk-form-mode .reservation-eyebrow,body.hk-form-mode .mini-section-title { color:#e6bc54 !important;letter-spacing:.07em;text-transform:uppercase;font-weight:900; }

/* Form sections */
body.hk-form-mode fieldset,
body.hk-form-mode .reservation-compact-section,
body.hk-form-mode .checkin-payment-panel,
body.hk-form-mode .hotel-doc-draft-box {
  border:1px solid rgba(62,137,178,.38) !important;border-radius:16px !important;background:rgba(5,25,44,.72) !important;padding:15px !important;
}
body.hk-form-mode fieldset legend { color:#dcb44d !important;font-size:12px !important;font-weight:900 !important;text-transform:uppercase;letter-spacing:.055em;padding:0 7px; }
body.hk-form-mode .form-grid { gap:13px !important; }
body.hk-form-mode label,body.hk-form-mode .field span,body.hk-form-mode .reservation-field > span { color:#d8e4ed !important;font-size:11px !important;font-weight:800 !important;letter-spacing:.015em; }

/* Inputs scoped to authenticated forms only */
body.hk-form-mode #content input:not([type="checkbox"]):not([type="radio"]),
body.hk-form-mode #content select,
body.hk-form-mode #content textarea,
body.hk-form-mode .reservation-work-window input:not([type="checkbox"]):not([type="radio"]),
body.hk-form-mode .reservation-work-window select,
body.hk-form-mode .reservation-work-window textarea,
body.hk-form-mode .checkinout-work-window input:not([type="checkbox"]):not([type="radio"]),
body.hk-form-mode .checkinout-work-window select,
body.hk-form-mode .checkinout-work-window textarea {
  min-height:46px !important;border:1px solid rgba(67,145,189,.55) !important;border-radius:11px !important;background:#061a2e !important;color:#f1f6fa !important;padding:10px 12px !important;box-shadow:inset 0 1px 2px rgba(0,0,0,.2) !important;outline:none !important;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease !important;
}
body.hk-form-mode #content textarea,body.hk-form-mode .reservation-work-window textarea,body.hk-form-mode .checkinout-work-window textarea { min-height:78px !important;resize:vertical; }
body.hk-form-mode #content input::placeholder,body.hk-form-mode #content textarea::placeholder,body.hk-form-mode .reservation-work-window input::placeholder,body.hk-form-mode .reservation-work-window textarea::placeholder,body.hk-form-mode .checkinout-work-window input::placeholder,body.hk-form-mode .checkinout-work-window textarea::placeholder { color:#8297a9 !important;opacity:1; }
body.hk-form-mode #content input:focus,body.hk-form-mode #content select:focus,body.hk-form-mode #content textarea:focus,body.hk-form-mode .reservation-work-window input:focus,body.hk-form-mode .reservation-work-window select:focus,body.hk-form-mode .reservation-work-window textarea:focus,body.hk-form-mode .checkinout-work-window input:focus,body.hk-form-mode .checkinout-work-window select:focus,body.hk-form-mode .checkinout-work-window textarea:focus {
  border-color:#35cbbb !important;box-shadow:0 0 0 3px rgba(34,199,181,.13) !important;background:#071e34 !important;
}

/* Status, info and validation banners */
body.hk-form-mode .reservation-live-pill,body.hk-form-mode .checkin-live-pill,body.hk-form-mode .status-badge.active,body.hk-form-mode .pill-ok {
  border-color:rgba(41,201,130,.42) !important;background:rgba(41,201,130,.12) !important;color:#8af0ba !important;
}
body.hk-form-mode .reservation-availability-note,body.hk-form-mode .field-hint,body.hk-form-mode .quote-auto-room-note,body.hk-form-mode .form-help {
  border-radius:10px !important;padding:9px 11px !important;border:1px solid rgba(230,184,63,.34) !important;background:rgba(230,184,63,.09) !important;color:#e8cf8a !important;
}
body.hk-form-mode .reservation-availability-note.ok { border-color:rgba(41,201,130,.35) !important;background:rgba(41,201,130,.10) !important;color:#9debc3 !important; }
body.hk-form-mode .reservation-availability-note.danger { border-color:rgba(239,68,68,.35) !important;background:rgba(239,68,68,.10) !important;color:#ffaaaa !important; }

/* Buttons — only authenticated workspaces */
body.hk-form-mode #content .primary-btn,
body.hk-form-mode .reservation-work-window .primary-btn,
body.hk-form-mode .checkinout-work-window .primary-btn,
body.hk-form-mode #content .success-btn {
  min-height:44px !important;border:1px solid rgba(96,236,220,.34) !important;border-radius:11px !important;background:linear-gradient(135deg,#1aa99b,#159083) !important;color:#fff !important;font-weight:900 !important;box-shadow:0 10px 20px rgba(9,124,114,.19) !important;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease !important;
}
body.hk-form-mode #content .primary-btn:hover,body.hk-form-mode .reservation-work-window .primary-btn:hover,body.hk-form-mode .checkinout-work-window .primary-btn:hover,body.hk-form-mode #content .success-btn:hover { transform:translateY(-1px);filter:brightness(1.07);box-shadow:0 13px 24px rgba(9,124,114,.26) !important; }
body.hk-form-mode #content button:not(.primary-btn):not(.success-btn):not(.danger-btn),
body.hk-form-mode .reservation-work-window button:not(.primary-btn):not(.danger-btn),
body.hk-form-mode .checkinout-work-window button:not(.primary-btn):not(.success-btn):not(.danger-btn) {
  border:1px solid rgba(87,145,182,.34) !important;border-radius:10px !important;background:#0c2942 !important;color:#d8e6ef !important;font-weight:800 !important;transition:transform .2s ease,border-color .2s ease,background .2s ease !important;
}
body.hk-form-mode #content button:not(.primary-btn):not(.danger-btn):hover,body.hk-form-mode .reservation-work-window button:not(.primary-btn):not(.danger-btn):hover,body.hk-form-mode .checkinout-work-window button:not(.primary-btn):not(.danger-btn):hover { transform:translateY(-1px);border-color:rgba(34,199,181,.56) !important;background:#103451 !important;color:#fff !important; }
body.hk-form-mode .danger-btn,body.hk-form-mode [data-cancel-reservation] { background:rgba(125,27,34,.30) !important;border:1px solid rgba(239,68,68,.42) !important;color:#ff9a9a !important; }

/* Tables */
body.hk-form-mode .table-card { overflow:hidden; }
body.hk-form-mode table { width:100%;border-collapse:separate !important;border-spacing:0 !important;color:#dbe6ee !important;font-size:12px !important; }
body.hk-form-mode thead th { background:#081d32 !important;color:#b9d4e6 !important;border-bottom:1px solid rgba(77,145,183,.36) !important;padding:11px 10px !important;font-size:10px !important;text-transform:uppercase;letter-spacing:.045em; }
body.hk-form-mode tbody td { background:rgba(7,27,46,.62) !important;border-bottom:1px solid rgba(255,255,255,.055) !important;color:#d2dee7 !important;padding:10px !important; }
body.hk-form-mode tbody tr:hover td { background:rgba(18,58,82,.70) !important; }

/* Reservation / Check-in windows follow approved premium form reference */
body.hk-form-mode .reservation-work-window,
body.hk-form-mode .checkinout-work-window { z-index:1000 !important; }
body.hk-form-mode .reservation-window-backdrop,body.hk-form-mode .checkinout-window-backdrop { background:rgba(1,8,16,.78) !important;backdrop-filter:blur(5px); }
body.hk-form-mode .reservation-window-shell,body.hk-form-mode .checkinout-window-shell {
  width:min(1180px,calc(100vw - 32px)) !important;max-height:calc(100vh - 28px) !important;border:1px solid rgba(216,167,46,.45) !important;border-radius:18px !important;background:#06182b !important;box-shadow:0 30px 80px rgba(0,0,0,.52) !important;overflow:hidden !important;
}
body.hk-form-mode .reservation-window-topbar,body.hk-form-mode .checkinout-window-topbar {
  min-height:58px !important;padding:10px 16px !important;background:linear-gradient(90deg,#153b68,#1a4d7f) !important;border-bottom:1px solid rgba(216,167,46,.30) !important;color:#fff !important;
}
body.hk-form-mode .reservation-window-topbar strong,body.hk-form-mode .checkinout-window-topbar strong { color:#fff !important;font-size:18px !important; }
body.hk-form-mode .reservation-window-topbar span,body.hk-form-mode .checkinout-window-topbar span { color:#c8d8e5 !important;font-size:10px !important; }
body.hk-form-mode .reservation-window-close,body.hk-form-mode .checkinout-window-close {
  width:42px !important;height:42px !important;border-radius:11px !important;background:#0d91c6 !important;color:#fff !important;border:1px solid rgba(255,255,255,.20) !important;font-size:25px !important;line-height:1 !important;
}
body.hk-form-mode .reservation-window-body,body.hk-form-mode .checkinout-window-body { padding:14px !important;background:#06182b !important;overflow:auto !important; }
body.hk-form-mode .reservation-pos-card,body.hk-form-mode .checkin-pos-card { max-width:none !important;margin:0 !important; }
body.hk-form-mode .reservation-pos-bg-orb { opacity:.18 !important; }
body.hk-form-mode .reservation-mini-stat { border:1px solid rgba(79,139,177,.30) !important;background:rgba(11,39,65,.70) !important;border-radius:13px !important;color:#fff !important; }
body.hk-form-mode .reservation-mini-stat span { color:#9fb2c2 !important; }
body.hk-form-mode .selected-room-stat { border-color:rgba(216,167,46,.56) !important; }
body.hk-form-mode .reservation-actions,body.hk-form-mode .checkin-actions,body.hk-form-mode .checkout-window-actions,.hk-action-bar {
  margin-top:12px !important;padding:13px !important;border-radius:14px !important;border:1px solid rgba(70,137,176,.25) !important;background:rgba(5,19,35,.82) !important;display:flex !important;justify-content:flex-end !important;gap:10px !important;
}

/* Document/POS/Accounting/HR broad normalization */
body.hk-form-mode .hotel-doc-hero,body.hk-form-mode .register-hero,body.hk-form-mode .hr-hero {
  border:1px solid rgba(216,167,46,.30) !important;border-radius:18px !important;background:linear-gradient(135deg,#0b2d4a,#0a2138) !important;color:#fff !important;box-shadow:0 14px 30px rgba(0,0,0,.18) !important;
}
body.hk-form-mode .hotel-doc-pill,body.hk-form-mode .record-pill { border:1px solid rgba(34,199,181,.30) !important;background:rgba(34,199,181,.09) !important;color:#9de9df !important; }
body.hk-form-mode .hr-tabbar { background:#071b2f !important;border-color:rgba(70,137,176,.30) !important; }
body.hk-form-mode .hr-tabbar button.active { background:linear-gradient(135deg,#159f93,#147f76) !important;color:#fff !important; }

/* Existing generic application footer becomes compact status footer on forms */
body.hk-form-mode .workspace > footer.system-footer { min-height:34px !important;padding:6px 14px !important;background:rgba(4,17,31,.92) !important;border-top:1px solid rgba(70,137,176,.20) !important;color:#7890a4 !important;font-size:10px !important; }
body.hk-form-mode .workspace > footer.system-footer img { width:18px !important;height:18px !important; }

@media(max-width:1100px){
  :root{--hk-sidebar-w:230px;}
  body.hk-form-mode .two-col{grid-template-columns:1fr !important;}
}
@media(max-width:820px){
  body.hk-form-mode { overflow:auto; }
  body.hk-form-mode #appView.hk-form-mode { display:block;height:auto;min-height:100vh; }
  #hkSidebar { position:relative;width:100%;height:auto;max-height:330px;border-right:0;border-bottom:1px solid rgba(66,137,174,.28); }
  .hk-side-brand{padding:10px 14px}.hk-side-brand img{width:34px;height:44px}.hk-sidebar-nav{max-height:210px}.hk-sidebar-user{display:none}
  body.hk-form-mode #appView.hk-form-mode > .workspace{height:auto;min-height:100vh;}
  body.hk-form-mode #content.content{overflow:visible !important;padding:12px !important;}
  body.hk-form-mode .form-grid{grid-template-columns:1fr !important;}
  body.hk-form-mode .reservation-window-shell,body.hk-form-mode .checkinout-window-shell{width:calc(100vw - 16px) !important;max-height:calc(100vh - 12px) !important;}
}

body.hk-form-mode .hk-form-status-footer { display:flex !important;align-items:center !important;gap:18px !important;min-height:48px !important;padding:7px 16px !important; }
.hk-form-status-item { display:flex;align-items:center;gap:8px;padding-right:16px;border-right:1px solid rgba(255,255,255,.09); }
.hk-form-status-item span { color:#8297a9;font-size:10px;font-weight:700; }
.hk-form-status-item strong { color:#e8f0f6;font-size:11px;white-space:nowrap; }
.hk-form-status-item i { display:inline-block;width:7px;height:7px;border-radius:50%;margin-left:5px;background:#29c982;box-shadow:0 0 0 3px rgba(41,201,130,.12); }
.hk-form-status-item i.offline { background:#ef4444; }
.hk-form-status-spacer { flex:1; }
.hk-form-status-footer button { min-height:34px !important;padding:0 13px !important;border-radius:9px !important;border:1px solid rgba(216,167,46,.30) !important;background:#0b263e !important;color:#e7c665 !important;font-size:10px !important;font-weight:800 !important; }
.hk-form-status-footer button.danger-btn { border-color:rgba(239,68,68,.34) !important;color:#ff9292 !important;background:rgba(105,20,26,.22) !important; }
@media(max-width:820px){ body.hk-form-mode .hk-form-status-footer{flex-wrap:wrap;gap:8px !important}.hk-form-status-spacer{display:none}.hk-form-status-item{padding-right:8px}.hk-form-status-footer button{flex:1} }