/* Hotel Kimininga Cloud v35.0 — Operating Divisions reference-dashboard redesign */
body.operating-divisions-page {
  overflow: hidden;
  background: #09101b;
}

body.operating-divisions-page #appView.operating-divisions-mode {
  background: #09101b;
}

body.operating-divisions-page #appView.operating-divisions-mode .workspace {
  min-height: 100vh;
  background: transparent !important;
}

body.operating-divisions-page #appView.operating-divisions-mode .topbar {
  display: none !important;
}

body.operating-divisions-page #appView.operating-divisions-mode #content.content {
  position: relative;
  min-height: 100vh;
  height: 100vh;
  overflow: auto;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}

.operating-divisions-dashboard {
  --gold: #e7b84b;
  --gold-soft: #f2d27b;
  --ink: #f8f8f5;
  --muted: rgba(255,255,255,.82);
  position: relative;
  min-height: 100vh;
  width: 100%;
  color: var(--ink);
  isolation: isolate;
  font-family: Inter, Manrope, "Segoe UI", Arial, sans-serif;
}

.division-dashboard-bg {
  position: fixed;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(180deg, rgba(6,11,21,.70), rgba(8,11,18,.55) 52%, rgba(3,6,11,.83)),
    url('assets/dashboard-hotel-bg.jpg?v=35.0.0') center/cover no-repeat;
  filter: saturate(.82);
}

.division-dashboard-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 18%, rgba(55,79,110,.26), transparent 34%),
    radial-gradient(circle at 90% 70%, rgba(196,118,30,.16), transparent 28%),
    linear-gradient(90deg, rgba(2,8,15,.48), rgba(2,8,15,.13) 48%, rgba(2,8,15,.42));
  backdrop-filter: blur(2px);
}

.division-dashboard-inner {
  width: min(1530px, calc(100% - 56px));
  min-height: 100vh;
  margin: 0 auto;
  padding: 26px 0 18px;
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.division-dashboard-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 34px;
  min-height: 122px;
}

.division-title-block h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(42px, 4vw, 64px);
  line-height: 1;
  font-weight: 700;
  color: #fff;
  letter-spacing: -.02em;
  text-shadow: 0 3px 9px rgba(0,0,0,.55);
}

.division-title-block p {
  margin: 9px 0 0;
  color: #f4f4f4;
  font-size: 17px;
  line-height: 1.45;
  text-shadow: 0 2px 5px rgba(0,0,0,.5);
}

.division-gold-line {
  display: block;
  width: 116px;
  height: 4px;
  margin-top: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #ffe196, #b77e1b);
  box-shadow: 0 2px 6px rgba(225,174,66,.34);
}

.division-brand-block {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
  min-width: 470px;
  padding-right: 8px;
}

.division-brand-logo {
  width: 92px;
  height: 126px;
  object-fit: contain;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.45));
}

.division-brand-copy {
  min-width: 310px;
  text-align: center;
}

.division-brand-copy strong {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  color: #fff;
  font-size: clamp(33px, 2.7vw, 46px);
  line-height: 1;
  letter-spacing: .015em;
  white-space: nowrap;
  text-shadow: 0 3px 8px rgba(0,0,0,.48);
}

.division-brand-copy span {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 15px;
  margin-top: 7px;
  color: #f6c85d;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}

.division-brand-copy i {
  display: block;
  height: 1px;
  background: linear-gradient(90deg, transparent, #bd8b2a);
}
.division-brand-copy i:last-child { background: linear-gradient(90deg, #bd8b2a, transparent); }

.department-grid.division-reference-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(250px, 1fr));
  gap: 15px 22px !important;
  flex: 1;
  align-content: stretch;
  margin: 0 !important;
}

.division-reference-card.department-tab {
  --accent: #38cabb;
  --accent-rgb: 56,202,187;
  --card1: #006d65;
  --card2: #003e3c;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
  border: 1px solid rgba(var(--accent-rgb), .92) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 88% 13%, rgba(255,255,255,.10), transparent 25%),
    linear-gradient(145deg, var(--card1), var(--card2)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 9px 20px rgba(0,0,0,.32) !important;
  cursor: pointer;
  transform: translateZ(0);
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease, filter .24s ease !important;
}

.division-reference-card.department-tab::before { display: none !important; }
.division-reference-card.department-tab::after { display: none !important; }

.division-reference-card.department-tab:hover,
.division-reference-card.department-tab:focus-visible {
  transform: translateY(-4px) scale(1.008) !important;
  filter: brightness(1.055) saturate(1.04);
  border-color: rgba(var(--accent-rgb), 1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.23),
    0 0 0 1px rgba(var(--accent-rgb), .18),
    0 16px 31px rgba(0,0,0,.42),
    0 0 24px rgba(var(--accent-rgb), .11) !important;
}

.division-card-main {
  position: relative;
  flex: 1;
  min-height: 0;
  padding: 23px 28px 17px;
  overflow: hidden;
}

.division-card-top {
  position: relative;
  display: grid;
  grid-template-columns: 88px minmax(0,1fr) auto;
  align-items: center;
  gap: 17px;
  z-index: 2;
}

.division-reference-card .department-icon {
  width: 82px !important;
  height: 82px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: var(--accent) !important;
  background: linear-gradient(145deg,#fff,#e6e6e6) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.7) !important;
  transition: transform .24s ease, box-shadow .24s ease !important;
}

.division-icon-svg { width: 50px; height: 50px; }

.division-reference-card:hover .department-icon {
  transform: translateY(-2px) scale(1.035) !important;
  box-shadow: 0 9px 19px rgba(0,0,0,.34), 0 0 16px rgba(var(--accent-rgb), .22) !important;
}

.division-card-heading h2 {
  margin: 0 0 4px !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(24px, 1.65vw, 30px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  text-shadow: 0 2px 5px rgba(0,0,0,.45);
}

.division-card-heading h4 {
  margin: 0 !important;
  color: var(--accent) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.38 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.32);
}

.division-reference-card .department-number {
  position: static !important;
  align-self: start;
  margin-top: -2px;
  color: var(--accent) !important;
  opacity: .92 !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 45px !important;
  font-weight: 700 !important;
  line-height: .95;
  text-shadow: 0 2px 5px rgba(0,0,0,.30);
}

.division-reference-card .division-card-main > p {
  position: relative;
  z-index: 2;
  max-width: 68%;
  margin: 26px 0 0 !important;
  color: rgba(255,255,255,.96) !important;
  font-size: 15.5px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  text-shadow: 0 2px 4px rgba(0,0,0,.38);
}

.division-decorative-icon {
  position: absolute;
  right: 18px;
  bottom: 5px;
  width: 132px;
  height: 132px;
  color: var(--accent);
  opacity: .22;
  pointer-events: none;
  transition: opacity .24s ease, transform .24s ease;
}
.division-decorative-svg { width: 100%; height: 100%; }
.division-reference-card:hover .division-decorative-icon { opacity: .31; transform: translate(-3px,-2px) scale(1.025); }

.division-reference-card .department-open {
  position: relative;
  z-index: 3;
  flex: 0 0 51px;
  width: 100%;
  margin: 0 !important;
  padding: 0 21px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  color: var(--accent) !important;
  background: rgba(0,0,0,.22) !important;
  border-top: 1px solid rgba(255,255,255,.13);
  transition: background .24s ease !important;
}

.division-reference-card .department-open span {
  min-width: 255px;
  padding: 8px 20px;
  border: 1px solid rgba(var(--accent-rgb), .62);
  border-radius: 999px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  background: rgba(0,0,0,.11);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
}

.division-reference-card .department-open b {
  margin-left: -43px;
  color: var(--accent);
  font-size: 30px;
  font-weight: 400;
  line-height: 1;
  transform: translateX(0);
  transition: transform .24s ease, filter .24s ease;
}

.division-reference-card:hover .department-open { background: rgba(0,0,0,.29) !important; }
.division-reference-card:hover .department-open b { transform: translateX(7px); filter: drop-shadow(0 0 5px rgba(var(--accent-rgb),.62)); }

.division-reference-card.dept-rooms { --accent:#42e2d1; --accent-rgb:66,226,209; --card1:#006d65; --card2:#003e3c; }
.division-reference-card.dept-fnb { --accent:#ffbd2e; --accent-rgb:255,189,46; --card1:#9a4d00; --card2:#4a2200; }
.division-reference-card.dept-facility { --accent:#4d9fff; --accent-rgb:77,159,255; --card1:#0b559a; --card2:#062851; }
.division-reference-card.dept-finance { --accent:#a47aff; --accent-rgb:164,122,255; --card1:#4a2b89; --card2:#21164b; }
.division-reference-card.dept-hr { --accent:#ff4e9a; --accent-rgb:255,78,154; --card1:#9c124b; --card2:#4b0b28; }
.division-reference-card.dept-sales { --accent:#74dc5b; --accent-rgb:116,220,91; --card1:#247426; --card2:#0d3b15; }

.division-status-panel {
  min-height: 96px;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 13px 20px;
  border: 1px solid rgba(229,187,94,.75);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(8,14,25,.91), rgba(7,11,18,.96));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.32);
  backdrop-filter: blur(12px);
}

.division-status-user {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 300px;
}
.division-user-avatar {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2px solid #e1b94f;
  color: #efc35d;
  background: linear-gradient(145deg,#2a3039,#11151b);
  font-family: Georgia,serif;
  font-size: 28px;
  font-weight: 700;
  box-shadow: inset 0 0 0 4px rgba(255,255,255,.05);
}
.division-status-user small,
.division-status-item small { display:block; color:#f0e8cf; font-size:12px; margin-bottom:2px; }
.division-status-user strong { display:block; color:#fff; font-family:Georgia,serif; font-size:21px; line-height:1.06; }
.division-status-user span { display:block; margin-top:3px; color:#e7b84b; font-size:13px; font-weight:700; }
.division-status-separator { width:1px; height:51px; background:linear-gradient(180deg,transparent,rgba(255,255,255,.42),transparent); }

.division-status-item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 170px;
}
.status-icon {
  width: 43px;
  height: 43px;
  display: grid;
  place-items: center;
  color: #f0c655;
  font-size: 28px;
  line-height: 1;
}
.division-status-item strong { color:#fff; font-size:15px; font-weight:600; white-space:nowrap; }
#divisionStatusOnline i {
  display:inline-block;
  width:9px;
  height:9px;
  margin-left:8px;
  border-radius:50%;
  background:#50c86d;
  box-shadow:0 0 0 3px rgba(80,200,109,.14);
}
#divisionStatusOnline i.offline { background:#e05a5a; box-shadow:0 0 0 3px rgba(224,90,90,.14); }

.division-status-actions {
  margin-left: auto;
  display: flex;
  gap: 14px;
}
.division-status-actions button {
  min-height: 54px;
  padding: 0 24px;
  border-radius: 12px;
  color: #f2d67f;
  border: 1px solid #b9892e;
  background: rgba(44,34,15,.28);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.division-status-actions button span { margin-right:8px; font-size:21px; vertical-align:-2px; }
.division-status-actions button:hover:not(:disabled) {
  transform: translateY(-2px);
  background: rgba(142,104,31,.18);
  border-color:#edc15b;
  box-shadow:0 8px 16px rgba(0,0,0,.25),0 0 14px rgba(225,184,75,.10);
}
.division-status-actions button:disabled { opacity:.45; cursor:not-allowed; }
.division-status-actions .division-logout-btn {
  min-width: 200px;
  color:#ff6c70;
  border-color:#a92e39;
  background:rgba(88,15,24,.30);
}
.division-status-actions .division-logout-btn:hover { border-color:#e34e59; background:rgba(126,23,34,.37); box-shadow:0 8px 16px rgba(0,0,0,.25),0 0 15px rgba(224,69,79,.12); }

.no-division-access {
  grid-column: 1 / -1;
  padding: 45px;
  border: 1px solid rgba(231,184,75,.62);
  border-radius: 20px;
  background: rgba(6,12,22,.82);
  color: #fff;
  text-align: center;
}
.no-division-access h3 { color:#fff; font-size:26px; margin:0 0 8px; }
.no-division-access p { color:rgba(255,255,255,.82); }

@media (max-width: 1180px) {
  body.operating-divisions-page { overflow:auto; }
  body.operating-divisions-page #appView.operating-divisions-mode #content.content { height:auto; min-height:100vh; overflow:visible; }
  .division-dashboard-inner { width:min(100% - 36px, 1120px); }
  .division-dashboard-header { align-items:center; }
  .division-brand-block { min-width:360px; }
  .division-brand-logo { width:72px; height:100px; }
  .division-brand-copy { min-width:250px; }
  .division-brand-copy strong { font-size:32px; }
  .division-brand-copy span { font-size:24px; }
  .department-grid.division-reference-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; grid-template-rows:auto !important; }
  .division-reference-card.department-tab { min-height:285px !important; }
  .division-status-panel { flex-wrap:wrap; }
  .division-status-actions { width:100%; margin-left:0; justify-content:flex-end; }
}

@media (max-width: 760px) {
  .division-dashboard-inner { width:calc(100% - 24px); padding-top:18px; }
  .division-dashboard-header { flex-direction:column; min-height:0; gap:18px; }
  .division-title-block h1 { font-size:42px; }
  .division-title-block p { font-size:14px; }
  .division-brand-block { width:100%; min-width:0; justify-content:flex-start; gap:14px; }
  .division-brand-logo { width:62px; height:86px; }
  .division-brand-copy { min-width:0; text-align:left; }
  .division-brand-copy strong { font-size:27px; white-space:normal; }
  .division-brand-copy span { grid-template-columns:auto auto; justify-content:start; font-size:21px; }
  .division-brand-copy span i { display:none; }
  .department-grid.division-reference-grid { grid-template-columns:1fr !important; }
  .division-reference-card.department-tab { min-height:280px !important; }
  .division-card-main { padding:20px 20px 15px; }
  .division-card-top { grid-template-columns:68px minmax(0,1fr) auto; gap:12px; }
  .division-reference-card .department-icon { width:64px !important; height:64px !important; }
  .division-icon-svg { width:39px; height:39px; }
  .division-card-heading h2 { font-size:23px !important; }
  .division-card-heading h4 { font-size:13px !important; }
  .division-reference-card .department-number { font-size:35px !important; }
  .division-reference-card .division-card-main > p { max-width:78%; margin-top:20px !important; font-size:14px !important; }
  .division-decorative-icon { width:105px; height:105px; right:7px; }
  .division-reference-card .department-open span { min-width:230px; }
  .division-status-panel { gap:13px; }
  .division-status-user { min-width:100%; }
  .division-status-separator { display:none; }
  .division-status-item { min-width:calc(50% - 8px); }
  .division-status-actions { display:grid; grid-template-columns:1fr 1fr; }
  .division-status-actions button, .division-status-actions .division-logout-btn { min-width:0; padding:0 12px; }
}

@media (max-width: 480px) {
  .division-title-block h1 { font-size:36px; }
  .division-brand-copy strong { font-size:24px; }
  .division-reference-card .division-card-main > p { max-width:100%; padding-right:25px; }
  .division-decorative-icon { opacity:.12; }
  .division-reference-card .department-open span { min-width:205px; font-size:14px; }
  .division-status-item { min-width:100%; }
  .division-status-actions { grid-template-columns:1fr; }
}