/* ==========================================================================
   Katolikos — osTicket One theme (1.18.2) drop-in replacement
   File: assets/one/css/theme.css
   Notes:
   - Replace the entire file with this.
   - Place logo at /assets/one/images/logo-katolikos.png (≈240×48, transparent)
   - Fonts: Poppins (UI), Lora (headings)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;600;700&family=Poppins:wght@400;500;600&display=swap');

/* ---------------------------
   Brand tokens
---------------------------- */
:root{
  --k-navy:#0A1F32;
  --k-ink:#475569;
  --k-blue:#3b82f6;
  --k-blue-dark:#1e40af;
  --k-bg:#f8fafc;
  --k-card:#ffffff;
  --k-border:#e2e8f0;
  --k-muted:#94a3b8;
  --k-success:#10b981;
  --k-error:#ef4444;
  --k-warning:#f59e0b;

  --k-radius:12px;
  --k-radius-sm:10px;
}

/* ---------------------------
   Base reset / typography
---------------------------- */
*,
*::before,
*::after{ box-sizing:border-box; }

html{
  font-size:16px;
  -webkit-text-size-adjust:100%;
}
body{
  margin:0;
  background:var(--k-bg);
  color:var(--k-ink);
  font-family:"Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{ max-width:100%; height:auto; border:0; vertical-align:middle; }
a{ color:var(--k-blue); text-decoration:none; }
a:hover{ color:var(--k-blue-dark); text-decoration:underline; }

h1,h2,h3,h4,h5,h6{
  font-family:"Lora", Georgia, serif;
  color:var(--k-navy);
  margin:0 0 .5rem 0;
}
h1{ font-size:1.6rem; border-bottom:1px solid var(--k-border); padding-bottom:.35rem; }

/* ---------------------------
   Header & Navigation
   (neutralises old dark bars)
---------------------------- */
#header{
  position:relative;
  height:72px;
  padding:0 20px;
  background:#fff !important;
  color:var(--k-navy);
  border-bottom:1px solid var(--k-border);
  display:flex;
  align-items:center;
  gap:16px;
}
#logo{ display:flex; align-items:center; height:100%; }
#header #logo img{
  max-height:56px !important;
  height:auto !important;
  width:auto !important;
  padding:0 !important;
  vertical-align:middle !important;
}

/* Some “One” variants wrap a nav bar in this id; make it light */
div#nav-wrapper{
  background:#fff !important;
  color:var(--k-navy) !important;
  border-bottom:1px solid var(--k-border);
}
div#nav-wrapper .nav{ margin:0; padding:0; }
div#nav-wrapper li{ padding:6px 8px; max-height:none; }
div#nav-wrapper a,
.navbar a{ color:var(--k-navy) !important; text-decoration:none; }

/* Legacy top nav strip images — disable */
#nav{
  margin:0 20px; padding:8px 10px; height:auto;
  background:none !important;
  border-top:0; box-shadow:none;
  white-space:normal;
}
#nav li{ list-style:none; display:inline-block; }
#nav li a{
  background:none !important;
  color:var(--k-navy) !important;
  border-radius:999px;
  padding:.35rem .8rem;
}
#nav li a:hover{
  background:#f1f5f9 !important;
  color:var(--k-navy) !important;
}

/* ---------------------------
   Hero / Search banner (client)
---------------------------- */
.search-area-wrapper{
  background:#fff !important;
  background-image:none !important;
  min-height:auto !important;
  padding:20px 0 !important;
  border-bottom:1px solid var(--k-border);
}
.search-area-wrapper .search-area{ padding:0 !important; }
h3.search-header{ color:var(--k-navy) !important; font-size:2rem; font-weight:600; text-align:center; }
p.search-tag-line{
  font-family:"Lora", Georgia, serif !important;
  font-style:normal !important;
  color:var(--k-ink) !important;
  text-align:center;
  margin:.25rem 0 0 0;
}

/* Search form */
form.search-form{ margin:18px 0 0; text-align:center; }
form.search-form input.search-term{
  font-family:"Poppins", system-ui, sans-serif !important;
  width:72%;
  max-width:760px;
  padding:12px 14px;
  border:1px solid var(--k-border) !important;
  border-radius:var(--k-radius-sm) !important;
  box-shadow:none !important;
  color:#0f172a;
}
input.search-btn{
  background:var(--k-blue) !important;
  color:#fff !important;
  border:1px solid transparent !important;
  border-radius:10px !important;
  font-weight:600;
  padding:12px 22px;
}
form.search-form input.search-btn:hover{ background:var(--k-blue-dark) !important; }

/* ---------------------------
   Layout containers
---------------------------- */
#container{
  background:#fff;
  max-width:1140px;
  margin:0 auto;
  padding:15px;
  width:100%;
  border:1px solid var(--k-border);
  border-top:0;
  border-radius:0 0 var(--k-radius) var(--k-radius);
}
#content{ padding:20px 0; margin:0 20px; min-height:350px; }

/* ---------------------------
   Cards / panels
---------------------------- */
.card,
.content,
.login-box,
.sidebar .content,
#clientLogin,
.thread-entry .header,
.thread-entry .thread-body{
  background:var(--k-card) !important;
  border:1px solid var(--k-border) !important;
  border-radius:var(--k-radius) !important;
  box-shadow:none !important;
}
.card.new-ticket{ padding:40px; border:none; }

/* Avoid hover jump that looks gimmicky on support portals */
.card{ transform:none !important; transition:none !important; }

/* ---------------------------
   Buttons
---------------------------- */
a.btn.btn-primary,
.button,
.button:visited,
.blue.button,
input[type="submit"],
input[type="button"]{
  background:var(--k-blue) !important;
  color:#fff !important;
  border:1px solid transparent !important;
  border-radius:10px !important;
  font-weight:600;
  box-shadow:none !important;
  text-shadow:none !important;
}
a.btn.btn-primary:hover,
.blue.button:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover{ background:var(--k-blue-dark) !important; }
.button:active{ top:0 !important; box-shadow:none !important; }

/* Remove legacy coloured button variants */
.green.button, .blue.button{ background:var(--k-blue) !important; }

/* ---------------------------
   Links / text that used #353b65
---------------------------- */
a, .qns a, .widget-top ul li a, .featured-block a{
  color:var(--k-blue) !important;
}

/* ---------------------------
   Forms
---------------------------- */
input[type=text], input[type=email], input[type=password],
input[type=search], input[type=number], select, textarea{
  border:1px solid var(--k-border) !important;
  border-radius:10px !important;
  box-shadow:none !important;
  padding:8px 10px;
  font-family:"Poppins", system-ui, sans-serif;
}
input:focus, select:focus, textarea:focus{
  outline:2px solid rgba(59,130,246,.25) !important;
  border-color:var(--k-blue) !important;
}

/* Captcha row alignment tweaks */
#ticketForm div div.captchaRow input,
#clientLogin div div.captchaRow input{ top:0; }

/* ---------------------------
   Tables (lists / tickets)
---------------------------- */
#ticketTable,
table,
table.list,
.dataTable{
  border:1px solid var(--k-border) !important;
  border-collapse:collapse;
}
#ticketTable caption{
  padding:8px;
  text-align:left;
  color:var(--k-navy);
  background:#f8fafc;
  border-bottom:1px solid var(--k-border);
  font-weight:600;
}
#ticketTable th,
table.list th{
  height:auto; line-height:1.2;
  background:#f1f5f9 !important;
  color:var(--k-navy) !important;
  border:1px solid var(--k-border) !important;
  padding:8px;
}
#ticketTable td,
table.list td{
  padding:8px;
  border:1px solid var(--k-border) !important;
}
#ticketTable tr.alt td{ background:#fafafa; }

/* ---------------------------
   Alerts / messages
---------------------------- */
.message.notice,
#msg_notice{
  background:#ecfdf5 !important;
  border:1px solid #bbf7d0 !important;
  color:#065f46 !important;
}
#msg_warning, .warning-banner{
  background:#fffbeb !important;
  border:1px solid #fde68a !important;
  color:#92400e !important;
}
#msg_error{
  background:#fef2f2 !important;
  border:1px solid #fecaca !important;
  color:#991b1b !important;
}
#msg_info{
  background:#eff6ff !important;
  border:1px solid #bfdbfe !important;
  color:#1e3a8a !important;
}

/* ---------------------------
   Thread / conversation view
---------------------------- */
.thread-entry{ margin-bottom:16px; }
.thread-entry .header{
  padding:10px 14px;
  border-radius:10px 10px 0 0 !important;
  border-color:var(--k-border) !important;
  background:#f8fafc !important;
}
.thread-entry .thread-body{
  border-top:none !important;
  border-bottom:2px solid #cbd5e1 !important;
  border-radius:0 0 10px 10px !important;
}
.thread-body .attachments{
  background:#f1f5f9 !important;
  border-top:1px dotted #cbd5e1 !important;
}

/* Remove old sprite icons that clash */
#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:.8rem !important;
}

/* ---------------------------
   Sidebar
---------------------------- */
.sidebar{ margin:0 0 20px 20px; width:230px; }
.sidebar .content{
  padding:12px;
  border:1px solid var(--k-border) !important;
  background:#fff !important;
  border-radius:var(--k-radius) !important;
}
.sidebar section .header{ font-weight:700; color:var(--k-navy); }

/* ---------------------------
   Login box
---------------------------- */
#clientLogin{
  padding:20px;
  border-radius:var(--k-radius);
  box-shadow:none !important;
  background:#fff !important;
  border:1px solid var(--k-border) !important;
  background-image:none !important;
}
#clientLogin input[type=submit]{ padding:10px 16px; }

/* ---------------------------
   Footer
---------------------------- */
#footer{
  background:var(--k-navy) !important;
  color:#fff !important;
  text-align:center;
  font-size:14px;
  padding:14px;
}
#footer a{ color:#c7d2fe !important; text-decoration:underline; }

/* ---------------------------
   Misc legacy neutralisers
---------------------------- */
#kb > li{ background:none !important; border-bottom:1px solid var(--k-border) !important; }
#faq ol li a{ background:none !important; }
#landing_page #new_ticket,
#landing_page #check_status{
  background:none !important;
  padding-left:0 !important;
  width:auto !important;
  margin-top:16px;
}
.card-body{ border:1px solid #6e75af66; border-radius:var(--k-radius); }
.card-icon{ color:var(--k-blue); }

/* Remove “raise on hover” gimmick */
.card:hover{ transform:none !important; }

/* ---------------------------
   Pagination
---------------------------- */
#pagination{ margin:10px 0 30px 0; padding:0; border:0; }
#pagination li{ list-style:none; display:inline; font-size:12px; }
#pagination li a{
  display:inline-block; padding:6px 10px; margin-right:6px;
  border:1px solid var(--k-border); border-radius:999px;
  background:#fff;
}
#pagination li a:hover{ background:#f1f5f9; }
#pagination .active{
  display:inline-block; padding:6px 10px; margin-right:6px;
  font-weight:700; color:var(--k-navy);
  border:1px solid var(--k-blue); border-radius:999px; background:#eff6ff;
}

/* ---------------------------
   Mobile polish
---------------------------- */
@media (max-width: 768px){
  #container{ padding:10px; }
  #content{ margin:0; }
  .login-box{ width:100% !important; display:block !important; box-shadow:none !important; }
  .sidebar{ width:auto !important; margin:10px 0 !important; }
  form.search-form input.search-term{ width:100% !important; margin-right:0 !important; }
  input.search-btn{ width:100% !important; margin-top:8px; }
}

/* ---------------------------
   FINAL: make sure any stray
   dark anchors flip to brand
---------------------------- */
a, .qns a, .widget-top ul li a, .featured-block a{
  color:var(--k-blue) !important;
}

/* ===== Katolikos — remove the KB page sidebar & its small search ===== */

/* Hide the entire KB sidebar everywhere (this includes the compact search + "Help Topics" box) */
#content .sidebar,
.sidebar {
  display: none !important;
}

/* Make the main KB content span full width when the sidebar is hidden */
#content .faq-content,
#content .span8,
.faq-content {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
}

/* Belt-and-braces: if any compact-search bits leak outside .sidebar, hide them too */
#kb-search,
form#kb-search,
form[action*="kb/faq.php"]#kb-search,
.search.well,
.searchbar,
.search-form,
form#search-form-compact {
  display: none !important;
}

/* Ensure the article/category list is visible and not squashed */
#faq, #faq ol, #faq ol li,
.article-list, .article-headline {
  display: block !important;
  visibility: visible !important;
}