/* ============================================================
   Zimbra login - giao dien split-screen, branding theo domain
   File: /opt/zimbra/jetty_base/webapps/zimbra/public/brand/brand.css
   Tac gia: SSG Group IT  |  An toan: chi CSS, khong doi logic form
   ============================================================ */

:root{
  --zb-dark:   #0E4C4A;   /* mau nen chinh (nua trai) */
  --zb-dark2:  #06302F;   /* mau gradient toi hon */
  --zb-accent: #C89B3C;   /* mau nut bam / diem nhan */
  --zb-text:   #1F2A33;
  --zb-muted:  #61707E;
  --zb-line:   #DCE2E8;
  --zb-radius: 12px;
}

/* Khi JS da dung xong layout moi: an toan bo markup goc cua Zimbra */
body.zb-on{
  margin:0; padding:0; background:#fff; color:var(--zb-text);
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
body.zb-on > *:not(.zb-wrap){ display:none !important; }

.zb-wrap{ display:flex; min-height:100vh; }

/* ---------- Nua trai: hero / branding ---------- */
.zb-hero{
  flex:0 0 46%; position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(150deg,var(--zb-dark) 0%,var(--zb-dark2) 100%);
  display:flex; flex-direction:column; justify-content:center;
  padding:56px 56px 40px;
}
.zb-hero::before{                 /* anh nen tuy chon theo domain */
  content:""; position:absolute; inset:0;
  background-image:var(--zb-bg,none); background-size:cover; background-position:center;
  opacity:.22;
}
.zb-hero::after{                  /* hoa tiet mem */
  content:""; position:absolute; right:-140px; bottom:-160px;
  width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.10),transparent 70%);
}
.zb-hero-inner{ position:relative; z-index:2; max-width:460px; }
.zb-hero-logo{
  max-width:270px; max-height:96px; width:auto; height:auto; display:block;
  margin-bottom:34px; filter:drop-shadow(0 2px 10px rgba(0,0,0,.25));
}
.zb-hero-title{ margin:0 0 14px; font-size:32px; line-height:1.25; font-weight:700; letter-spacing:.2px; }
.zb-hero-sub{ margin:0; font-size:17px; color:rgba(255,255,255,.80); }
.zb-hero-list{
  position:relative; z-index:2; margin:26px 0 0; padding:0; list-style:none;
  border-top:1px solid rgba(255,255,255,.18); padding-top:20px;
}
.zb-hero-list li{
  position:relative; padding-left:20px; margin-bottom:9px;
  font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.72);
}
.zb-hero-list li::before{
  content:""; position:absolute; left:0; top:9px; width:7px; height:7px;
  border-radius:50%; background:var(--zb-accent); opacity:.9;
}
.zb-hero-foot{
  position:relative; z-index:2; margin-top:auto; padding-top:32px;
  font-size:13px; color:rgba(255,255,255,.55);
}

/* ---------- Nua phai: form dang nhap ---------- */
.zb-panel{ flex:1; display:flex; align-items:center; justify-content:center; padding:40px 24px; }
.zb-card{ width:100%; max-width:430px; }
.zb-logo-sm{ display:none; max-width:200px; max-height:64px; margin:0 auto 26px; }
.zb-title{ margin:0 0 6px; font-size:26px; font-weight:700; color:var(--zb-text); }
.zb-sub{ margin:0 0 28px; font-size:15px; color:var(--zb-muted); }
.zb-domain-tag{
  display:inline-block; margin:0 0 22px; padding:5px 12px; border-radius:999px;
  background:#F1F5F4; color:var(--zb-dark); font-size:13px; font-weight:600;
}

/* Thong bao loi cua Zimbra duoc JS chuyen len day */
.zb-error{
  margin:0 0 18px; padding:12px 14px; border-radius:10px;
  background:#FDECEC; border:1px solid #F3C2C2; color:#8E1B1B; font-size:14px;
}
.zb-error:empty{ display:none; }

/* --- Bang form goc cua Zimbra: bien tung o thanh 1 dong doc --- */
.zb-card form{ margin:0; }
.zb-card table,.zb-card tbody,.zb-card tr,.zb-card td,.zb-card th{
  display:block; width:100%; border:0; padding:0; margin:0; background:none;
}
.zb-card tr{ margin-bottom:16px; }
.zb-card td{ padding:0; }
.zb-card label{
  display:block; margin-bottom:7px; font-size:14px; font-weight:600; color:#44515E;
}
.zb-card input[type=text],
.zb-card input[type=email],
.zb-card input[type=password],
.zb-card select{
  box-sizing:border-box; width:100%; height:48px; padding:10px 14px;
  font-size:16px; color:var(--zb-text); background:#fff;
  border:1px solid var(--zb-line); border-radius:var(--zb-radius);
  outline:none; transition:border-color .15s,box-shadow .15s;
}
.zb-card input[type=text]:focus,
.zb-card input[type=password]:focus,
.zb-card select:focus{
  border-color:var(--zb-dark);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--zb-dark) 18%,transparent);
}
.zb-card input[type=checkbox]{ width:18px; height:18px; margin:0 8px 0 0; vertical-align:-3px; }
.zb-card input[type=checkbox] + label,
.zb-card label.zb-inline{ display:inline; font-weight:400; font-size:15px; color:var(--zb-muted); }

.zb-card input[type=submit],
.zb-card button[type=submit]{
  box-sizing:border-box; width:100%; height:50px; margin-top:4px;
  font-size:17px; font-weight:700; letter-spacing:.3px; color:#fff;
  background:var(--zb-accent); border:0; border-radius:var(--zb-radius);
  cursor:pointer; transition:filter .15s,transform .05s;
}
.zb-card input[type=submit]:hover,
.zb-card button[type=submit]:hover{ filter:brightness(1.07); }
.zb-card input[type=submit]:active{ transform:translateY(1px); }

/* Khoi "Phien ban / Day la gi" - day xuong duoi, chu nho hon */
.zb-extra{ margin-top:22px; }
.zb-card tr.zb-extra > td{ border-top:1px solid var(--zb-line); padding-top:18px; }
.zb-extra label{ font-size:13px; color:var(--zb-muted); font-weight:600; }
.zb-extra select{ height:42px; font-size:15px; }
.zb-extra a{ font-size:13px; color:var(--zb-muted); }
.zb-card a{ color:var(--zb-dark); }

.zb-copy{ margin:26px 0 0; font-size:12px; color:#9AA6B2; text-align:center; line-height:1.6; }

/* ---------- Man hinh nho ---------- */
@media (max-width:980px){
  .zb-wrap{ flex-direction:column; }
  .zb-hero{ flex:none; padding:28px 24px; text-align:center; align-items:center; }
  .zb-hero-inner{ max-width:none; }
  .zb-hero-logo{ margin:0 auto 16px; max-height:70px; }
  .zb-hero-title{ font-size:22px; }
  .zb-hero-sub{ font-size:15px; }
  .zb-hero-list{
  position:relative; z-index:2; margin:26px 0 0; padding:0; list-style:none;
  border-top:1px solid rgba(255,255,255,.18); padding-top:20px;
}
.zb-hero-list li{
  position:relative; padding-left:20px; margin-bottom:9px;
  font-size:14.5px; line-height:1.5; color:rgba(255,255,255,.72);
}
.zb-hero-list li::before{
  content:""; position:absolute; left:0; top:9px; width:7px; height:7px;
  border-radius:50%; background:var(--zb-accent); opacity:.9;
}
.zb-hero-foot{ display:none; }
  .zb-panel{ padding:32px 20px 48px; }
}
@media (max-width:560px){
  .zb-hero{ display:none; }
  .zb-logo-sm{ display:block; }
  .zb-title{ font-size:22px; text-align:center; }
  .zb-sub{ text-align:center; }
  .zb-domain-tag{ display:block; width:fit-content; margin:0 auto 22px; }
}

/* Man hinh toi (tuy trinh duyet) */
@media (prefers-color-scheme:dark){
  body.zb-on.zb-allow-dark{ background:#12171C; color:#E7ECF1; }
  body.zb-on.zb-allow-dark .zb-panel{ background:#12171C; }
  body.zb-on.zb-allow-dark .zb-title{ color:#E7ECF1; }
  body.zb-on.zb-allow-dark .zb-card input[type=text],
  body.zb-on.zb-allow-dark .zb-card input[type=password],
  body.zb-on.zb-allow-dark .zb-card select{ background:#1B222A; border-color:#2C3641; color:#E7ECF1; }
}

/* nen trang cho logo domain (logo cong ty thuong la chu toi) */
.zb-hero-logo{ background:#fff; padding:12px 18px; border-radius:14px; box-shadow:0 6px 18px rgba(0,0,0,.18); max-height:110px; }

.zb-copy a{ color:inherit; font-weight:700; text-decoration:none; }
.zb-copy a:hover{ text-decoration:underline; }