/* ============================================================
   Prolific Press — Support Portal skin
   Overrides osTicket's default client theme to match prolificpress.com
   Loaded LAST in include/client/header.inc.php so it wins the cascade.
   Client portal only — the staff panel (/scp/) is untouched.
   ============================================================ */
:root{
  --pp-paper:#ECE6DA; --pp-surface:#F6F1E7; --pp-surface-2:#FBF7EF;
  --pp-ink:#211B15; --pp-ink-soft:#574E44; --pp-ink-faint:#8A8073;
  --pp-line:rgba(33,27,21,.14); --pp-line-strong:rgba(33,27,21,.24);
  --pp-accent:#8C2F27; --pp-accent-hover:#71211B;
  --pp-brass:#957534; --pp-brass-soft:rgba(149,117,52,.5);
  --pp-band:#15161C; --pp-band-ink:#ECE6DA; --pp-band-soft:#A9A398; --pp-band-brass:#C6A667; --pp-band-line:rgba(236,230,218,.14);
  --pp-display:'Iowan Old Style','Palatino Linotype',Palatino,'Book Antiqua',Georgia,'Times New Roman',serif;
  --pp-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --pp-mono:ui-monospace,'SF Mono','Cascadia Code','Segoe UI Mono',Menlo,Consolas,monospace;
  --pp-radius:4px;
  --pp-shadow:0 1px 2px rgba(33,27,21,.06),0 8px 24px -12px rgba(33,27,21,.18);
}

/* ---------- base ---------- */
body{
  background:var(--pp-paper)!important;
  color:var(--pp-ink)!important;
  font-family:var(--pp-body)!important;
  font-size:15px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--pp-display)!important;color:var(--pp-ink)!important;font-weight:600;letter-spacing:-.01em}
a{color:var(--pp-accent);text-decoration:none}
a:hover{color:var(--pp-accent-hover);text-decoration:underline;text-underline-offset:2px}
hr{border:0;border-top:1px solid var(--pp-line)}

/* ---------- layout width (default is a cramped 840px) ---------- */
#container{
  width:auto!important;max-width:1040px!important;
  margin:0 auto!important;
  padding:0 clamp(18px,4vw,40px)!important;
  background:transparent!important;
}

/* ---------- header ---------- */
#header{
  height:auto!important;min-height:0!important;
  padding:1.5rem 0 1.1rem!important;
  margin-bottom:0!important;
  border-bottom:1px solid var(--pp-line);
  background:transparent!important;
  position:relative;
}
#header:after{content:"";display:block;clear:both}
#header #logo,#header a#logo{
  float:left;margin:0!important;padding:0!important;height:auto!important;
  background:none!important;border:0!important;
}
#header #logo img{max-height:52px;width:auto;max-width:340px}
#header .pull-right{float:right;text-align:right}
#header .pull-right p{
  width:auto!important;margin:.2rem 0!important;
  font-family:var(--pp-mono);font-size:.72rem;letter-spacing:.06em;
  color:var(--pp-ink-faint)!important;
}
#header .pull-right p a{color:var(--pp-ink-soft)!important;font-weight:600}
#header .pull-right p a:hover{color:var(--pp-accent)!important}

/* ---------- primary nav (tabs) ---------- */
#nav{
  background:none!important;border:0!important;box-shadow:none!important;
  margin:0 0 1.6rem!important;padding:.4rem 0 0!important;
  border-bottom:1px solid var(--pp-line);
  overflow:visible!important;height:auto!important;
}
#nav li{background:none!important;border:0!important;margin:0 1.4rem 0 0!important}
#nav li a,#nav li a.home,#nav li a.new,#nav li a.status,#nav li a.kb,#nav li a.tickets{
  background:none!important;border:0!important;box-shadow:none!important;
  padding:.55rem 0 .8rem!important;margin:0!important;
  font-family:var(--pp-mono)!important;font-size:.74rem!important;letter-spacing:.12em!important;
  text-transform:uppercase!important;color:var(--pp-ink-soft)!important;font-weight:600;
  border-bottom:2px solid transparent!important;border-radius:0!important;
  display:inline-block;line-height:1;text-indent:0!important;width:auto!important;height:auto!important;
}
#nav li a:hover{color:var(--pp-ink)!important;border-bottom-color:var(--pp-brass-soft)!important;text-decoration:none}
#nav li a.active{color:var(--pp-accent)!important;border-bottom-color:var(--pp-accent)!important}

/* ---------- content shell ---------- */
#content{
  background:var(--pp-surface-2)!important;
  border:1px solid var(--pp-line)!important;
  border-radius:var(--pp-radius)!important;
  box-shadow:var(--pp-shadow);
  padding:clamp(1.4rem,3vw,2.4rem)!important;
  margin-bottom:2.4rem;
  color:var(--pp-ink-soft);
}
#content p,#content li,#content td,#content label,#content .faded{color:var(--pp-ink-soft)}
#content strong,#content b{color:var(--pp-ink)}

/* ---------- landing page ---------- */
#landing_page .front-page-button a.button,
#landing_page .sidebar{margin-bottom:1rem}
.sidebar .content{color:var(--pp-ink-soft)}

/* ---------- buttons ---------- */
.button,a.button,input[type="submit"],input[type="button"],.btn,button.btn,
#landing_page a.blue.button,#landing_page a.green.button{
  display:inline-flex!important;align-items:center;gap:.5em;
  font-family:var(--pp-body)!important;font-weight:600!important;font-size:.92rem!important;
  padding:.72em 1.35em!important;border-radius:var(--pp-radius)!important;
  border:1px solid transparent!important;cursor:pointer;text-transform:none!important;
  background-image:none!important;box-shadow:var(--pp-shadow);
  transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease;
  text-shadow:none!important;line-height:1.2!important;height:auto!important;
}
.button:hover,a.button:hover,input[type="submit"]:hover,.btn:hover,
#landing_page a.blue.button:hover,#landing_page a.green.button:hover{
  transform:translateY(-2px);text-decoration:none;
}
/* primary (blue -> terracotta) */
.button,a.button,input[type="submit"],.btn,#landing_page a.blue.button{
  background:var(--pp-accent)!important;color:#FBF7EF!important;
}
.button:hover,a.button:hover,input[type="submit"]:hover,.btn:hover,#landing_page a.blue.button:hover{
  background:var(--pp-accent-hover)!important;color:#fff!important;
}
/* secondary (green -> ghost) */
#landing_page a.green.button,a.green.button{
  background:transparent!important;color:var(--pp-ink)!important;
  border-color:var(--pp-line-strong)!important;box-shadow:none!important;
}
#landing_page a.green.button:hover,a.green.button:hover{
  border-color:var(--pp-accent)!important;color:var(--pp-accent)!important;background:transparent!important;
}

/* ---------- form fields ---------- */
input[type="text"],input[type="email"],input[type="password"],input[type="url"],
input[type="number"],input[type="tel"],textarea,select{
  font-family:var(--pp-body)!important;font-size:.95rem!important;color:var(--pp-ink)!important;
  background:var(--pp-surface-2)!important;
  border:1px solid var(--pp-line-strong)!important;border-radius:var(--pp-radius)!important;
  padding:.6em .75em!important;box-shadow:none!important;
}
textarea{line-height:1.55}
input:focus,textarea:focus,select:focus{
  outline:none!important;border-color:var(--pp-accent)!important;
  box-shadow:0 0 0 3px rgba(140,47,39,.13)!important;
}
label{color:var(--pp-ink)}

/* ---------- tables (ticket lists) ---------- */
table.list,table.custom-info,#content table{border-color:var(--pp-line)!important}
table.list th,#content table th{
  background:var(--pp-surface)!important;color:var(--pp-ink)!important;
  font-family:var(--pp-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  border-color:var(--pp-line)!important;
}
table.list td,#content table td{border-color:var(--pp-line)!important;color:var(--pp-ink-soft)}
table.list tr:hover td{background:var(--pp-surface)!important}

/* ---------- message bars ---------- */
#msg_error,.error_bar,#msg_warning,.warning_bar,#msg_notice,.notice_bar{
  border-radius:var(--pp-radius)!important;padding:.85rem 1.1rem!important;margin:0 0 1.4rem!important;
  font-size:.92rem!important;border:1px solid transparent!important;background-image:none!important;
}
#msg_error,.error_bar{background:rgba(140,47,39,.08)!important;border-color:rgba(140,47,39,.32)!important;color:var(--pp-accent)!important}
#msg_warning,.warning_bar{background:rgba(149,117,52,.1)!important;border-color:var(--pp-brass-soft)!important;color:#6f571f!important}
#msg_notice,.notice_bar{background:rgba(44,122,75,.1)!important;border-color:rgba(44,122,75,.35)!important;color:#20603a!important}

/* ---------- footer ---------- */
#footer{
  border-top:1px solid var(--pp-line)!important;background:transparent!important;
  color:var(--pp-ink-faint)!important;font-size:.82rem;padding:1.4rem 0 2.4rem!important;
}
#footer a{color:var(--pp-ink-soft)}
#footer a:hover{color:var(--pp-accent)}

/* ---------- responsive ---------- */
@media (max-width:720px){
  #header .pull-right,#header #logo{float:none;text-align:left}
  #header #logo{display:block;margin-bottom:.8rem!important}
  #nav li{margin-right:1rem!important}
}