/* ================================================================
   MyHelpDesk — Production Theme v5.0
   Design aprovado · Inter · MYCONTROLE TECH
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  --white:#FFFFFF;--bg:#F4F7FA;--border:#E3E8EF;--border-h:#C9D5E3;
  --g50:#F8FAFC;--g100:#F0F4F8;--g200:#E3E8EF;--g300:#C9D5E3;
  --g400:#97A6BA;--g500:#6B7B8D;--g600:#4A5568;--g700:#2D3748;--g800:#1A2535;
  --blue:#1F6FEB;--blue-h:#1558CC;--blue-bg:#EBF3FF;
  --green:#0F9B58;--green-bg:#E6F7EF;
  --red:#D92B3A;--red-bg:#FDE8EA;
  --orange:#E07B00;--orange-bg:#FFF4E0;
  --font:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --r6:6px;--r8:8px;--r12:12px;--r16:16px;--r20:20px;
  --s-xs:0 1px 2px rgba(15,26,42,.06);
  --s-sm:0 1px 4px rgba(15,26,42,.08),0 2px 8px rgba(15,26,42,.04);
  --s-md:0 4px 16px rgba(15,26,42,.10);
  --s-lg:0 8px 32px rgba(15,26,42,.12);
  --ease:150ms cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font)!important;font-size:14.5px;line-height:1.6;color:var(--g700);background:var(--bg)!important;background-image:none!important;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--font)!important;font-weight:700;line-height:1.25;color:var(--g800)}
a{color:var(--blue);text-decoration:none;transition:color var(--ease)}
a:hover{color:var(--blue-h);text-decoration:none}
a.link{display:inline}
img{max-width:100%;height:auto}
ul{list-style:none}
input,select,textarea,button{font-family:var(--font)}

/* ── Container full-width ─────────────────────────────────────── */
#container{width:100%!important;max-width:100%!important;background:transparent!important;box-shadow:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important}

/* ── Header — branco, sticky ─────────────────────────────────── */
#header{background:var(--white)!important;background-image:none!important;width:100%!important;height:auto!important;min-height:60px!important;padding:0 32px!important;display:flex!important;align-items:center!important;flex-direction:row!important;position:sticky!important;top:0!important;z-index:500!important;border-bottom:0.5px solid var(--border)!important;box-shadow:var(--s-xs)!important;-webkit-box-shadow:var(--s-xs)!important;-moz-box-shadow:var(--s-xs)!important}
a#logo,#logo{order:-1!important;display:inline-flex!important;align-items:center!important;gap:10px!important;height:60px!important;padding:0!important;margin-right:24px!important;float:none!important;border:none!important;outline:none!important;background:none!important;box-shadow:none!important;text-decoration:none!important;flex-shrink:0!important;font-size:16px!important;font-weight:600!important;color:var(--g800)!important}
#header #logo img,a#logo img{max-height:32px!important;max-width:160px!important;filter:none!important;border:none!important;outline:none!important;box-shadow:none!important;vertical-align:middle!important}
.valign-helper{display:none!important}
#header .pull-right,#header .flush-right{order:1!important;float:none!important;display:flex!important;align-items:center!important;gap:12px!important;margin-left:auto!important;padding:0!important}
#header .pull-right a,#header .flush-right a{font-family:var(--font)!important;font-size:13.5px!important;font-weight:600!important;color:var(--white)!important;background:var(--blue)!important;padding:8px 20px!important;border-radius:var(--r6)!important;border:none!important;transition:background var(--ease)!important;box-shadow:0 1px 3px rgba(31,111,235,.3)!important}
#header .pull-right a:hover,#header .flush-right a:hover{background:var(--blue-h)!important;color:var(--white)!important}
.pull-left,.pull-right,.flush-right,.flush-left{float:none!important}
.clear,div.clear{display:none!important;height:0!important}

/* ── Nav — integrado no header ───────────────────────────────── */
#nav{background:var(--white)!important;background-image:none!important;border-top:none!important;border-bottom:0.5px solid var(--border)!important;box-shadow:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important;width:100%!important;height:auto!important;min-height:48px!important;margin:0!important;padding:0 32px!important;display:flex!important;align-items:center!important;gap:4px!important}
#nav li{display:inline-flex!important;margin:0!important;padding:0!important}
#nav li a{display:inline-flex!important;align-items:center!important;height:36px!important;line-height:normal!important;font-family:var(--font)!important;font-size:13.5px!important;font-weight:500!important;color:var(--g500)!important;padding:0 12px!important;margin:0!important;border-radius:var(--r6)!important;background-color:transparent!important;background-image:none!important;border-bottom:none!important;transition:all var(--ease)!important;text-decoration:none!important}
#nav li a.home,#nav li a.kb,#nav li a.new,#nav li a.status,#nav li a.tickets{background-image:none!important;padding-left:12px!important}
#nav li a:hover{color:var(--g800)!important;background-color:var(--g100)!important;border-bottom:none!important}
#nav li a.active{color:var(--blue)!important;background-color:var(--blue-bg)!important;font-weight:600!important;border-bottom:none!important}

/* ── Hero (injetado via PHP) ─────────────────────────────────── */
#mhd-hero{background:linear-gradient(135deg,#1558CC 0%,#1F6FEB 60%,#3B82F6 100%);padding:56px 32px;text-align:center}
#mhd-hero h1{font-family:var(--font);font-size:clamp(22px,3vw,34px);font-weight:800;color:#fff;margin-bottom:10px;letter-spacing:-.4px}
#mhd-hero p{font-size:15px;color:rgba(255,255,255,.78);margin-bottom:28px}
#mhd-search{position:relative;max-width:480px;margin:0 auto}
#mhd-search input{width:100%;height:46px;border:none;border-radius:23px;padding:0 50px 0 20px;font-family:var(--font);font-size:14px;background:rgba(255,255,255,.18);color:#fff;outline:none;transition:background var(--ease)}
#mhd-search input::placeholder{color:rgba(255,255,255,.55)}
#mhd-search input:focus{background:rgba(255,255,255,.25)}
#mhd-search-icon{position:absolute;right:18px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.6);font-size:16px;pointer-events:none}

/* ── Action Cards ────────────────────────────────────────────── */
#mhd-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:820px;margin:-28px auto 0;padding:0 32px;position:relative;z-index:10}
.mhd-card{background:var(--white);border:0.5px solid var(--border);border-radius:var(--r16);padding:28px 24px;text-align:center;transition:all var(--ease)}
.mhd-card:hover{border-color:var(--blue);box-shadow:var(--s-md);transform:translateY(-2px)}
.mhd-card-icon{width:52px;height:52px;border-radius:var(--r12);margin:0 auto 14px;display:flex;align-items:center;justify-content:center;font-size:24px}
.mhd-card-icon.blue{background:var(--blue-bg)}
.mhd-card-icon.green{background:var(--green-bg)}
.mhd-card h3{font-size:16px;font-weight:700;color:var(--g800);margin-bottom:8px}
.mhd-card p{font-size:13.5px;color:var(--g500);line-height:1.65;margin-bottom:18px}
.mhd-btn-primary{display:inline-flex;align-items:center;gap:6px;background:var(--blue);color:#fff;border:none;border-radius:var(--r6);padding:9px 22px;font-family:var(--font);font-size:13.5px;font-weight:600;cursor:pointer;transition:background var(--ease);text-decoration:none}
.mhd-btn-primary:hover{background:var(--blue-h);color:#fff}
.mhd-btn-secondary{display:inline-flex;align-items:center;gap:6px;background:var(--white);color:var(--g700);border:0.5px solid var(--border);border-radius:var(--r6);padding:9px 22px;font-family:var(--font);font-size:13.5px;font-weight:500;cursor:pointer;transition:all var(--ease);text-decoration:none}
.mhd-btn-secondary:hover{background:var(--blue-bg);border-color:var(--blue);color:var(--blue)}

/* ── Content ──────────────────────────────────────────────────── */
#content{max-width:1200px!important;margin:0 auto!important;padding:40px 32px 80px!important}

/* ── Landing page — esconde sidebar original ─────────────────── */
#landing_page{display:flex!important;flex-direction:column!important;gap:24px!important}
#landing_page .sidebar,.sidebar.pull-right{display:none!important}
#landing_page .content,#landing_page .main-content{width:100%!important;float:none!important}
#landing_page .content .thread-body,#landing_page .main-content .thread-body{background:var(--white)!important;border:0.5px solid var(--border)!important;border-radius:var(--r16)!important;padding:32px 36px!important;box-shadow:var(--s-xs)!important}
#landing_page .content .thread-body h1,#landing_page .content .thread-body h2{font-size:20px!important;font-weight:700!important;color:var(--g800)!important;margin-bottom:10px!important}
#landing_page .content .thread-body p{font-size:14.5px!important;color:var(--g500)!important;line-height:1.75!important}

/* ── Page headings ───────────────────────────────────────────── */
#content>h1,#content>h2{font-size:22px!important;font-weight:700!important;color:var(--g800)!important;margin-bottom:6px!important}
#content>p{color:var(--g500)!important;font-size:14px!important;margin-bottom:24px!important;line-height:1.65!important}

/* ── Form pages — card wrapper ───────────────────────────────── */
#content>form,form.open-form,#open-form,.ticket-form,
form[action*="open.php"],form[action*="view.php"]{
  background:var(--white)!important;border:0.5px solid var(--border)!important;
  border-radius:var(--r16)!important;overflow:hidden!important;
  box-shadow:var(--s-sm)!important;max-width:740px!important;margin:0 auto!important;
}

/* ── Form sections ────────────────────────────────────────────── */
.form-group,.field-group{margin-bottom:16px!important}
.form-group:last-child{margin-bottom:0!important}

/* ── Campos ──────────────────────────────────────────────────── */
label,.form-label{font-family:var(--font)!important;font-size:13px!important;font-weight:600!important;color:var(--g700)!important;display:block!important;margin-bottom:5px!important}
input[type="text"],input[type="email"],input[type="password"],input[type="tel"],input[type="search"],input[type="number"],select,textarea{width:100%!important;border:0.5px solid var(--border-h)!important;border-radius:var(--r6)!important;background:var(--white)!important;color:var(--g800)!important;font-family:var(--font)!important;font-size:14px!important;padding:9px 12px!important;outline:none!important;transition:border-color var(--ease),box-shadow var(--ease)!important;box-shadow:none!important;-webkit-appearance:none!important;appearance:none!important;display:block!important}
input:focus,select:focus,textarea:focus{border-color:var(--blue)!important;box-shadow:0 0 0 3px rgba(31,111,235,.1)!important;outline:none!important}
input::placeholder,textarea::placeholder{color:var(--g400)!important}
textarea{min-height:120px!important;resize:vertical!important;line-height:1.65!important}
input[type="checkbox"],input[type="radio"]{accent-color:var(--blue)!important;width:15px!important;height:15px!important}

/* ── Botões ──────────────────────────────────────────────────── */
.button,.button:visited{display:block!important;font-family:var(--font)!important;font-size:14px!important;font-weight:600!important;padding:10px 20px!important;border-radius:var(--r8)!important;text-align:center!important;text-decoration:none!important;border:none!important;border-bottom:none!important;box-shadow:none!important;-webkit-box-shadow:none!important;text-shadow:none!important;cursor:pointer!important;transition:all var(--ease)!important;max-width:100%!important;-webkit-border-radius:var(--r8)!important;position:relative!important;top:0!important}
.blue.button,.blue.button:visited,a.blue.button,a.blue.button:visited{background:var(--blue)!important;background-color:var(--blue)!important;color:#fff!important;box-shadow:0 1px 4px rgba(31,111,235,.25)!important;border-bottom:none!important;text-shadow:none!important}
.blue.button:hover,a.blue.button:hover{background:var(--blue-h)!important;background-color:var(--blue-h)!important;color:#fff!important;box-shadow:0 4px 16px rgba(31,111,235,.35)!important;transform:translateY(-1px)!important}
.green.button,.green.button:visited,a.green.button,a.green.button:visited{background:var(--white)!important;background-color:var(--white)!important;color:var(--g700)!important;border:0.5px solid var(--border-h)!important;border-bottom:0.5px solid var(--border-h)!important;box-shadow:var(--s-xs)!important;text-shadow:none!important;padding:9px 20px!important}
.green.button:hover,a.green.button:hover{background:var(--blue-bg)!important;border-color:var(--blue)!important;color:var(--blue)!important}
input[type="submit"],button[type="submit"]{font-family:var(--font)!important;font-weight:600!important;font-size:14px!important;background:var(--blue)!important;background-color:var(--blue)!important;color:#fff!important;border:none!important;border-bottom:none!important;border-radius:var(--r6)!important;padding:10px 24px!important;cursor:pointer!important;transition:all var(--ease)!important;box-shadow:0 1px 3px rgba(31,111,235,.25)!important;text-shadow:none!important}
input[type="submit"]:hover,button[type="submit"]:hover{background:var(--blue-h)!important;background-color:var(--blue-h)!important;box-shadow:0 4px 14px rgba(31,111,235,.35)!important}
a.cancel,input[type="reset"],button.cancel{font-family:var(--font)!important;font-weight:500!important;font-size:13.5px!important;color:var(--g500)!important;background:transparent!important;border:0.5px solid var(--border)!important;border-radius:var(--r6)!important;padding:9px 18px!important;cursor:pointer!important;transition:all var(--ease)!important;text-decoration:none!important}
a.cancel:hover,input[type="reset"]:hover{background:var(--g100)!important;color:var(--g700)!important}

/* ── Login / Auth pages ──────────────────────────────────────── */
#login-form,.login-form,form.login{max-width:420px!important;margin:20px auto!important;background:var(--white)!important;border:0.5px solid var(--border)!important;border-radius:var(--r16)!important;padding:32px!important;box-shadow:var(--s-md)!important}

/* ── Alerts ──────────────────────────────────────────────────── */
.error_bar,div.error_bar{background:var(--red-bg)!important;border:0.5px solid #F5C6CB!important;border-left:3px solid var(--red)!important;color:#7B1A22!important;padding:12px 16px!important;border-radius:var(--r8)!important;font-size:13.5px!important;margin-bottom:16px!important}
.warning_bar,div.warning_bar{background:var(--orange-bg)!important;border:0.5px solid #FFD591!important;border-left:3px solid var(--orange)!important;color:#7B4300!important;padding:12px 16px!important;border-radius:var(--r8)!important;font-size:13.5px!important;margin-bottom:16px!important}
.notice_bar,div.notice_bar{background:var(--blue-bg)!important;border:0.5px solid #A8CAFF!important;border-left:3px solid var(--blue)!important;color:#1040A0!important;padding:12px 16px!important;border-radius:var(--r8)!important;font-size:13.5px!important;margin-bottom:16px!important}

/* ── Tabelas ─────────────────────────────────────────────────── */
table,table.list,table.tickets{width:100%!important;background:var(--white)!important;border:0.5px solid var(--border)!important;border-radius:var(--r12)!important;overflow:hidden!important;box-shadow:var(--s-xs)!important;border-collapse:collapse!important}
table thead th{font-family:var(--font)!important;font-size:11px!important;font-weight:600!important;text-transform:uppercase!important;letter-spacing:.7px!important;color:var(--g400)!important;background:var(--g50)!important;padding:12px 16px!important;border-bottom:0.5px solid var(--border)!important}
table thead th a{color:var(--g400)!important}
table tbody tr{border-bottom:0.5px solid var(--g50)!important;transition:background var(--ease)!important}
table tbody tr:last-child{border-bottom:none!important}
table tbody tr:hover{background:var(--blue-bg)!important}
table tbody td{padding:13px 16px!important;font-size:13.5px!important;color:var(--g700)!important;border:none!important;vertical-align:middle!important}

/* ── Thread ──────────────────────────────────────────────────── */
.thread-entry{background:var(--white)!important;border:0.5px solid var(--border)!important;border-radius:var(--r12)!important;padding:20px 24px!important;margin-bottom:12px!important;box-shadow:var(--s-xs)!important}
.thread-entry.response{border-left:3px solid var(--blue)!important}
.thread-entry.message{border-left:3px solid var(--green)!important}
.thread-entry.note{border-left:3px solid var(--orange)!important;background:var(--orange-bg)!important}
.thread-entry .header{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-bottom:12px!important;padding-bottom:10px!important;border-bottom:0.5px solid var(--border)!important;background:none!important;border-radius:0!important;box-shadow:none!important}

/* ── Footer ──────────────────────────────────────────────────── */
#footer{background:var(--g800)!important;background-color:var(--g800)!important;background-image:none!important;width:100%!important;max-width:100%!important;margin-top:0!important;padding:24px 32px!important;text-align:center!important;color:var(--g500)!important;font-size:13px!important}
#footer a{color:var(--g500)!important;font-size:12px!important;transition:color var(--ease)!important}
#footer a:hover{color:#93C5FD!important}
#poweredBy{display:none!important}

/* ── Pagination ──────────────────────────────────────────────── */
.pagination,ul.pagination{display:flex!important;gap:4px!important;list-style:none!important;padding:20px 0 0!important;justify-content:center!important}
.pagination li a,.pagination li span{display:flex!important;align-items:center!important;justify-content:center!important;width:34px!important;height:34px!important;border-radius:var(--r6)!important;border:0.5px solid var(--border)!important;color:var(--g600)!important;font-size:13px!important;font-weight:500!important;transition:all var(--ease)!important}
.pagination li.active a{background:var(--blue)!important;border-color:var(--blue)!important;color:#fff!important}
.pagination li a:hover{background:var(--blue-bg)!important;border-color:var(--blue)!important}

/* ── Scrollbar ───────────────────────────────────────────────── */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:var(--g100)}
::-webkit-scrollbar-thumb{background:var(--g300);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:var(--g400)}

/* ── RTL ─────────────────────────────────────────────────────── */
.rtl #nav li a{background-image:none!important;padding-left:12px!important;padding-right:12px!important}

/* ── Responsive ──────────────────────────────────────────────── */
@media(max-width:768px){
  #header{padding:0 16px!important}
  #nav{padding:0 8px!important;overflow-x:auto!important;min-height:44px!important}
  #mhd-hero{padding:36px 16px!important}
  #mhd-cards{grid-template-columns:1fr!important;padding:0 16px!important;margin-top:-20px}
  #content{padding:24px 16px 60px!important}
  #footer{padding:20px 16px!important}
}
