/* =========================================================
   CLIENT PORTAL
   ========================================================= */
body.likha-portal { margin:0; background:#F6F7F9; color:var(--clr-dark, #0E1629); font-family:var(--ff-body, 'DM Sans', system-ui, sans-serif); }
.likha-portal *, .likha-portal *::before, .likha-portal *::after { box-sizing:border-box; }
.likha-portal h1, .likha-portal h2 { font-family:var(--ff-display, 'Sora', sans-serif); color:#0E1629; margin:0; letter-spacing:-.02em; }
.likha-portal a { color:var(--clr-brand, #2A4BD7); }
.pt-wrap { width:100%; max-width:1120px; margin:0 auto; padding-inline:1.25rem; }
.pt-muted { color:#5B6678; }
.pt-logo { display:block; height:48px; width:auto; max-width:260px; }
.pt-logo.site-logo__img--invert { filter:brightness(0) invert(1); }

/* ---------- Login screen ---------- */
.pt-login { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:2rem 1rem; background:#0B1220; }
.pt-login__inner { width:100%; max-width:430px; display:grid; gap:1.5rem; justify-items:center; }
.pt-login__brand .pt-logo { height:72px; }
.pt-login__card { width:100%; padding:2rem; }
.pt-login__card h1 { font-size:1.5rem; margin-bottom:.35rem; }
.pt-login__card .pt-muted { margin:0 0 1.25rem; font-size:.9375rem; }
.pt-login__back { color:rgba(255,255,255,.7) !important; font-size:.875rem; text-decoration:none; }
.pt-login__back:hover { color:#fff !important; }
.pt-help { margin:1.25rem 0 0; font-size:.8125rem; color:#5B6678; text-align:center; }

/* ---------- Cards, forms, buttons ---------- */
.pt-card { background:#fff; border:1px solid #E3E6EC; border-radius:16px; padding:1.5rem; box-shadow:0 1px 3px rgba(27,43,107,.05); }
.pt-narrow { max-width:720px; }
.pt-form { display:grid; gap:.5rem; }
.pt-form label { font-weight:600; font-size:.875rem; margin-top:.5rem; }
.pt-form input[type=text], .pt-form input[type=password], .pt-form input[type=url], .pt-form select, .pt-form textarea {
  width:100%; padding:.75rem 1rem; border:1.5px solid #D8DCE4; border-radius:10px; font:inherit; font-size:.9375rem; background:#fff; color:#0E1629; outline:none; transition:border-color .15s, box-shadow .15s; }
.pt-form input:focus, .pt-form select:focus, .pt-form textarea:focus { border-color:#2A4BD7; box-shadow:0 0 0 3px rgba(42,75,215,.15); }
.pt-form input[type=file] { font-size:.875rem; padding:.5rem 0; }
.pt-check { display:flex !important; align-items:center; gap:.5rem; font-weight:500 !important; margin-top:.25rem !important; }
.pt-row { display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:.875rem; margin:.25rem 0 .5rem; flex-wrap:wrap; }
.pt-row .pt-check { margin:0 !important; }
.pt-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.pt-hint { font-size:.8125rem; color:#5B6678; margin:0; }
.pt-actions { display:flex; gap:.75rem; margin-top:.75rem; flex-wrap:wrap; }
.pt-btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1.4rem; border-radius:10px; font:inherit; font-weight:600; font-size:.9375rem; cursor:pointer; text-decoration:none !important; border:1.5px solid transparent; transition:transform .15s, box-shadow .15s, background .15s; }
.pt-btn--primary { background:#2A4BD7; color:#fff !important; box-shadow:none; }
.pt-btn--primary:hover { background:#1D38AD; transform:translateY(-1px); box-shadow:0 8px 18px rgba(42,75,215,.28); }
.pt-btn--ghost { background:#fff; color:#0E1629 !important; border-color:#D8DCE4; }
.pt-btn--ghost:hover { background:#F6F7F9; }
.pt-btn--block { width:100%; }
.pt-notice { padding:.85rem 1rem; border-radius:10px; font-size:.9rem; font-weight:500; margin-bottom:1rem; }
.pt-notice--success { background:#e8f7f0; color:#116b49; border:1px solid #bfe8d4; }
.pt-notice--error { background:#fdecec; color:#9b1c1c; border:1px solid #f6c7c7; }

/* ---------- App shell ---------- */
.pt-top { background:#0B1220; }
.pt-top__inner { display:flex; align-items:center; gap:1.5rem; min-height:68px; flex-wrap:wrap; padding-block:.5rem; }
.pt-top__nav { display:flex; gap:.25rem; flex:1; }
.pt-top__nav a { color:rgba(255,255,255,.75); text-decoration:none; padding:.5rem .9rem; border-radius:8px; font-size:.9rem; font-weight:500; }
.pt-top__nav a:hover, .pt-top__nav a.is-active { color:#fff; background:rgba(255,255,255,.12); }
.pt-top__user { display:flex; align-items:center; gap:1rem; color:rgba(255,255,255,.8); font-size:.875rem; }
.pt-top__user a { color:#fff !important; text-decoration:underline; }
.pt-top__user em { font-style:normal; font-size:.7rem; background:#F2A516; color:#0B1220; padding:1px 7px; border-radius:99px; font-weight:700; margin-left:.35rem; }
.pt-main { padding-block:2rem 3rem; min-height:60vh; }
.pt-head { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem; }
.pt-head h1 { font-size:1.75rem; }
.pt-head p { margin:.35rem 0 0; }
.pt-h2 { font-size:1.125rem; margin:1.75rem 0 .75rem; }
.pt-foot { display:flex; justify-content:space-between; padding-block:1.25rem 2rem; font-size:.8125rem; color:#5B6678; border-top:1px solid #E3E6EC; }

/* ---------- Dashboard ---------- */
.pt-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.5rem; }
.pt-stat { background:#fff; border:1.5px solid #E3E6EC; border-radius:14px; padding:1rem 1.25rem; text-decoration:none !important; display:grid; gap:.15rem; transition:border-color .15s, transform .15s; }
.pt-stat:hover, .pt-stat.is-active { border-color:#2A4BD7; transform:translateY(-2px); }
.pt-stat__n { font-family:var(--ff-display, 'Sora', sans-serif); font-size:1.75rem; font-weight:700; color:#0E1629; }
.pt-stat__l { font-size:.8125rem; color:#5B6678; font-weight:500; }
.pt-table-wrap { padding:0; overflow-x:auto; }
.pt-table { width:100%; border-collapse:collapse; min-width:560px; }
.pt-table th { text-align:left; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; color:#5B6678; padding:.9rem 1.25rem; border-bottom:1px solid #E3E6EC; }
.pt-table td { padding:1rem 1.25rem; border-bottom:1px solid #EEF0F4; font-size:.9375rem; vertical-align:middle; }
.pt-table tr:last-child td { border-bottom:0; }
.pt-link { font-weight:600; text-decoration:none; color:#0E1629 !important; }
.pt-link:hover { color:#2A4BD7 !important; }
.pt-empty { text-align:center; color:#5B6678; padding:2.5rem; }
.pt-badge, .pt-prio { display:inline-block; padding:3px 11px; border-radius:99px; font-size:.75rem; font-weight:700; white-space:nowrap; }
.pt-badge--open { background:#E8EDFC; color:#1D38AD; }
.pt-badge--progress { background:#efe8fb; color:#6b3fb8; }
.pt-badge--waiting { background:#fdf3d6; color:#8a6500; }
.pt-badge--done { background:#e3f5ec; color:#12704b; }
.pt-prio--low { background:#EEF0F4; color:#5b6b8a; }
.pt-prio--normal { background:#E8EDFC; color:#1D38AD; }
.pt-prio--high { background:#fdebd8; color:#a1560c; }
.pt-prio--urgent { background:#fde3e3; color:#a31d1d; }

/* ---------- Ticket ---------- */
.pt-ticket { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:1.5rem; align-items:start; }
.pt-ticket__side { display:grid; gap:1rem; position:sticky; top:1rem; }
.pt-ticket__title { font-size:1.5rem; margin:.25rem 0 1rem; }
.pt-msg__body { line-height:1.65; overflow-wrap:anywhere; }
.pt-thread { display:grid; gap:.75rem; margin-bottom:1rem; }
.pt-msg { background:#fff; border:1px solid #E3E6EC; border-radius:14px; padding:1rem 1.25rem; max-width:92%; }
.pt-msg--staff { background:#EEF2FD; border-color:#D5DEF8; margin-left:auto; }
.pt-msg--note { background:#fff8e1; border-color:#f0dfa1; }
.pt-msg__head { display:flex; gap:.6rem; align-items:center; margin-bottom:.35rem; font-size:.875rem; flex-wrap:wrap; }
.pt-msg__head .pt-muted { font-size:.8rem; }
.pt-tag { background:#f0c94d; color:#4d3b00; font-size:.68rem; font-weight:700; padding:1px 8px; border-radius:99px; text-transform:uppercase; }
.pt-event { text-align:center; font-size:.8125rem; color:#5B6678; }
.pt-event span { opacity:.8; }
.pt-files { list-style:none; margin:.75rem 0 0; padding:0; display:grid; gap:.35rem; }
.pt-files li { font-size:.875rem; }
.pt-files li span { color:#5B6678; font-size:.78rem; margin-left:.35rem; }
.pt-dl { display:grid; grid-template-columns:90px 1fr; gap:.65rem .75rem; margin:0; font-size:.875rem; align-items:center; }
.pt-dl dt { color:#5B6678; font-weight:500; }
.pt-dl dd { margin:0; font-weight:600; overflow-wrap:anywhere; }

@media (max-width:900px) {
  .pt-ticket { grid-template-columns:1fr; }
  .pt-ticket__side { position:static; order:-1; }
  .pt-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px) {
  .pt-grid2 { grid-template-columns:1fr; }
  .pt-top__inner { gap:.5rem 1rem; }
  .pt-top__nav { order:3; width:100%; flex:none; }
  .pt-msg { max-width:100%; }
  .pt-foot { flex-direction:column; gap:.5rem; }
}


/* Loading state */
@keyframes pt-spin { to { transform: rotate(360deg); } }
.pt-spinner { display:inline-block; width:16px; height:16px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; animation:pt-spin .7s linear infinite; vertical-align:-3px; }
.pt-btn.is-loading { cursor:progress; opacity:.9; transform:none !important; }
.pt-btn--ghost.is-loading .pt-spinner { border-color:rgba(42,75,215,.3); border-top-color:#2A4BD7; }
@media (prefers-reduced-motion: reduce) { .pt-spinner { animation-duration:1.6s; } }
