/* ============================================================
   Gilmedia Support - Enterprise Clean theme (client-facing)
   Shared across: home.php (new ticket), login.php,
   client-login.php, client-dashboard.php
   Activated per page with a body class: gil-body | gil-auth | gil-dash
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --gil-bg:#f4f6f9; --gil-paper:#ffffff; --gil-navy:#0f1b2d; --gil-ink:#1a2433;
  --gil-ink-soft:#566073; --gil-ink-faint:#8b95a7; --gil-line:#e4e8ef; --gil-line-strong:#d2d8e2;
  --gil-primary:#f37333; --gil-primary-dark:#d85a1f; --gil-primary-soft:#fff1ea;
  --gil-danger:#dc2626; --gil-danger-bg:#fef2f2; --gil-green:#16a34a;
  /* keep legacy vars defined so existing inline styles resolve */
  --primary-color:#f37333; --primary-dark:#d85a1f;
  --gil-r:10px; --gil-r-lg:14px;
  --gil-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

/* ---------- Top bar (shared public header) ---------- */
.gil-topbar{background:var(--gil-paper);border-bottom:1px solid var(--gil-line);position:sticky;top:0;z-index:1000;}
.gil-topbar-inner{max-width:1140px;margin:0 auto;width:100%;padding:0 clamp(16px,4vw,24px);height:64px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.gil-brand{display:flex;align-items:center;gap:14px;min-width:0;text-decoration:none;}
.gil-brand img{height:26px;width:auto;}
.gil-tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gil-ink-soft);font-weight:700;padding-left:14px;border-left:1px solid var(--gil-line-strong);white-space:nowrap;}
.gil-topbar-actions{display:flex;align-items:center;gap:12px;flex:none;}
.gil-login{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--gil-navy);background:var(--gil-paper);border:1px solid var(--gil-line-strong);padding:9px 18px;border-radius:var(--gil-r);cursor:pointer;transition:.15s;white-space:nowrap;text-decoration:none;}
.gil-login:hover{border-color:var(--gil-navy);background:#fafbfc;}
.gil-login svg{width:15px;height:15px;}
@media(max-width:560px){.gil-topbar-inner{height:56px;}.gil-tag{display:none;}.gil-brand img{height:22px;}.gil-login{padding:8px 14px;font-size:13.5px;}}

/* ---------- Buttons ---------- */
.gil-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 20px;border:none;border-radius:var(--gil-r);cursor:pointer;font-family:var(--gil-font);font-size:15px;font-weight:600;color:#fff;background:var(--gil-primary);transition:.15s;box-shadow:0 2px 6px rgba(243,115,51,.3);}
.gil-btn:hover{background:var(--gil-primary-dark);}
.gil-btn:focus-visible{outline:2px solid var(--gil-primary);outline-offset:2px;}
.gil-btn svg{width:16px;height:16px;}
.gil-btn-block{width:100%;}
.gil-btn-ghost{background:#fff;color:var(--gil-navy);border:1px solid var(--gil-line-strong);box-shadow:none;}
.gil-btn-ghost:hover{background:#fafbfc;border-color:var(--gil-navy);}

/* ============================================================
   AUTH PAGES  (login.php, client-login.php)  -> body.gil-auth
   ============================================================ */
body.gil-auth{background:var(--gil-bg) !important;font-family:var(--gil-font);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 16px;margin:0;}
.gil-auth-card{background:var(--gil-paper);border:1px solid var(--gil-line);border-radius:18px;box-shadow:0 24px 60px -24px rgba(40,50,70,.28);padding:clamp(26px,5vw,38px) clamp(22px,4vw,34px);width:100%;max-width:430px;}
.gil-auth-head{text-align:center;margin-bottom:24px;}
.gil-auth-head img{height:32px;width:auto;margin:0 auto 18px;display:block;}
.gil-auth-title{font-size:1.5rem;font-weight:700;color:var(--gil-navy);letter-spacing:-.02em;margin:0 0 5px;}
.gil-auth-sub{font-size:.95rem;color:var(--gil-ink-soft);margin:0;}
.gil-info{display:flex;gap:11px;background:#eff5ff;border:1px solid #cfe0fb;color:#1e40af;border-radius:var(--gil-r);padding:13px 14px;margin-bottom:22px;font-size:13px;line-height:1.5;}
.gil-info svg{width:18px;height:18px;flex:none;margin-top:1px;color:#2563eb;}
.gil-info b{display:block;font-weight:600;margin-bottom:2px;}
.gil-field{margin-bottom:16px;}
.gil-label{display:block;font-size:13px;font-weight:600;color:var(--gil-ink);margin-bottom:7px;}
.gil-input{width:100%;padding:11px 13px;font-family:inherit;font-size:14.5px;color:var(--gil-ink);background:#fff;border:1px solid var(--gil-line-strong);border-radius:var(--gil-r);transition:.15s;box-sizing:border-box;}
.gil-input::placeholder{color:var(--gil-ink-faint);}
.gil-input:focus{outline:none;border-color:var(--gil-primary);box-shadow:0 0 0 3px rgba(243,115,51,.13);}
.gil-hint{font-size:12px;color:var(--gil-ink-faint);margin:5px 0 0;}
.gil-check{display:flex;align-items:center;gap:9px;margin:14px 0;font-size:13.5px;color:var(--gil-ink-soft);}
.gil-check input{width:17px;height:17px;accent-color:var(--gil-primary);flex:none;}
.gil-error{background:var(--gil-danger-bg);border:1px solid #fecaca;color:#991b1b;border-radius:var(--gil-r);padding:11px 13px;margin-bottom:16px;font-size:13.5px;}
.gil-turnstile-row{margin:16px 0;}
.gil-auth-links{text-align:center;margin-top:20px;font-size:13.5px;color:var(--gil-ink-soft);}
.gil-auth-links a{color:var(--gil-primary-dark);font-weight:600;text-decoration:none;}
.gil-auth-links a:hover{text-decoration:underline;}
.gil-auth-sep{color:var(--gil-line-strong);margin:0 8px;}

/* ============================================================
   NEW TICKET PAGE  (home.php)  -> body.gil-body
   Overrides the page's legacy inline/CSS styling.
   ============================================================ */
body.gil-body{background:var(--gil-bg) !important;animation:none !important;font-family:var(--gil-font);}
body.gil-body::before{display:none !important;}

.gil-body .form-container{background:transparent !important;box-shadow:none !important;border:none !important;border-radius:0 !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;overflow:visible !important;}
.gil-body .form-header{background:transparent !important;color:var(--gil-navy) !important;text-align:left !important;padding:0 0 1.5rem !important;min-height:0 !important;display:block !important;border-radius:0 !important;overflow:visible !important;}
.gil-body .form-header::before,.gil-body .form-header::after{display:none !important;content:none !important;}
.gil-body .form-header .particle,.gil-body .form-header .mouse-glow{display:none !important;}
.gil-body .form-header h1{font-size:clamp(1.7rem,3.5vw,2.2rem) !important;font-weight:700 !important;color:var(--gil-navy) !important;background:none !important;-webkit-text-fill-color:var(--gil-navy) !important;text-shadow:none !important;animation:none !important;filter:none !important;letter-spacing:-.02em !important;margin:.35rem 0 !important;}
.gil-body .greeting-message{font-size:.95rem !important;color:var(--gil-ink-soft) !important;background:none !important;-webkit-text-fill-color:var(--gil-ink-soft) !important;text-shadow:none !important;font-weight:400 !important;margin:0 !important;}
.gil-crumb{font-size:13px;color:var(--gil-ink-faint);font-weight:500;}
.gil-crumb b{color:var(--gil-ink-soft);font-weight:600;}
.gil-body .form-body{padding:0 !important;background:transparent !important;}

/* two-column layout */
.gil-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start;}
@media(max-width:900px){.gil-layout{grid-template-columns:1fr;}}

/* form panel */
.gil-body .gil-panel{background:var(--gil-paper);border:1px solid var(--gil-line);border-radius:var(--gil-r-lg);box-shadow:0 1px 2px rgba(16,27,45,.04);padding:clamp(20px,3vw,32px);}

/* field restyle */
.gil-body .field-icon-wrapper{display:none !important;}
.gil-body .field-group{margin-bottom:18px;}
.gil-body .field-label{gap:0 !important;margin-bottom:7px !important;}
.gil-body .field-label span{font-size:.9rem !important;font-weight:600 !important;color:var(--gil-ink) !important;}
.gil-body .input-with-icon .input-icon{display:none !important;}
.gil-body .input-with-icon .form-input{padding-left:13px !important;}
.gil-body .form-input{padding:11px 13px !important;border:1px solid var(--gil-line-strong) !important;border-radius:var(--gil-r) !important;font-size:14.5px !important;background:#fff !important;}
.gil-body .form-input:focus{border-color:var(--gil-primary) !important;box-shadow:0 0 0 3px rgba(243,115,51,.13) !important;}
.gil-body .two-column{gap:16px !important;}

/* website down */
.gil-body .website-down-checkbox{background:var(--gil-danger-bg) !important;border:1px solid #fecaca !important;padding:13px 15px !important;border-radius:var(--gil-r) !important;}

/* dropzone */
.gil-body .drop-zone{background:#fafbfc !important;border:1.5px dashed var(--gil-line-strong) !important;border-radius:var(--gil-r) !important;padding:24px !important;}
.gil-body #dropZoneContent>div:first-child{background:var(--gil-primary-soft) !important;background-image:none !important;}
.gil-body #dropZoneContent>div:first-child svg{color:var(--gil-primary-dark) !important;stroke:var(--gil-primary-dark) !important;}
.gil-body #dropZoneContent p span{color:var(--gil-primary-dark) !important;}

/* buttons */
.gil-body .submit-btn{background:var(--gil-primary) !important;background-image:none !important;border-radius:var(--gil-r) !important;font-size:1rem !important;padding:14px 20px !important;box-shadow:0 2px 6px rgba(243,115,51,.3) !important;}
.gil-body .submit-btn:hover:not(:disabled){background:var(--gil-primary-dark) !important;}
.gil-body #nextBtn{background:var(--gil-primary) !important;background-image:none !important;}

/* Quill tidy */
.gil-body .ql-toolbar{border-radius:var(--gil-r) var(--gil-r) 0 0 !important;border-color:var(--gil-line-strong) !important;background:#fafbfc !important;}
.gil-body .ql-container{border-radius:0 0 var(--gil-r) var(--gil-r) !important;border-color:var(--gil-line-strong) !important;}

/* ---------- Sidebar (home.php) ---------- */
.gil-side{display:flex;flex-direction:column;gap:18px;}
.gil-side-card{background:var(--gil-paper);border:1px solid var(--gil-line);border-radius:var(--gil-r-lg);padding:20px;box-shadow:0 1px 2px rgba(16,27,45,.04);}
.gil-side-card h3{font-size:13px;font-weight:700;color:var(--gil-navy);margin:0 0 14px;text-transform:uppercase;letter-spacing:.05em;}
.gil-step{display:flex;gap:12px;margin-bottom:14px;}
.gil-step:last-child{margin-bottom:0;}
.gil-sico{width:30px;height:30px;flex:none;border-radius:8px;display:grid;place-items:center;background:var(--gil-primary-soft);color:var(--gil-primary-dark);}
.gil-sico svg{width:15px;height:15px;}
.gil-stext b{display:block;font-size:13.5px;color:var(--gil-ink);font-weight:600;}
.gil-stext span{font-size:12.5px;color:var(--gil-ink-soft);}
.gil-sla-note{font-size:12.5px;color:var(--gil-ink-faint);margin:0 0 16px;}
.gil-sla-group{margin-bottom:16px;}
.gil-sla-group:last-child{margin-bottom:0;}
.gil-sla-gtitle{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;color:var(--gil-primary-dark);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;}
.gil-sla-gtitle svg{width:14px;height:14px;flex:none;}
.gil-sla{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 0;font-size:13px;}
.gil-sla span{color:var(--gil-ink-soft);}
.gil-sla b{color:var(--gil-navy);font-weight:600;white-space:nowrap;}
.gil-sla-foot{font-size:12px;color:var(--gil-ink-faint);margin:6px 0 0;line-height:1.5;}
.gil-note-box{margin-top:16px;padding:13px 14px;background:var(--gil-primary-soft);border:1px solid #fad6c4;border-radius:var(--gil-r);font-size:12.5px;color:var(--gil-ink-soft);line-height:1.55;}
.gil-note-box b{display:block;color:var(--gil-navy);font-weight:600;margin-bottom:3px;}

/* ============================================================
   CLIENT DASHBOARD  (client-dashboard.php)  -> body.gil-dash
   ============================================================ */
body.gil-dash{background:var(--gil-bg) !important;font-family:var(--gil-font);}
.gil-dash table{font-family:var(--gil-font);}