:root{
  --st-bg:#0b0f1a; --st-panel:#0f172a; --st-text:#e5e7eb; --st-sub:#cbd5e1;
  --st-accent:#2563eb; --st-ok:#22c55e; --st-err:#ef4444; --st-border:rgba(255,255,255,.08);
  --st-user:#0b1220; --st-admin:#0ea5e9;
}

.st-tickets,.st-card,.st-input,.st-btn{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}

/* Layout */
.st-tickets{max-width:980px;margin:28px auto;padding:0 14px}
.st-card{background:#0e1425;color:#fff;border-radius:14px;padding:18px;border:1px solid rgba(255,255,255,.06);box-shadow:0 10px 24px rgba(0,0,0,.18)}
.st-card + .st-card{margin-top:16px}
.st-create-toggle .st-btn-lg{height:48px;font-size:16px;font-weight:800}

/* Grid */
.st-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.st-field{min-width:0}
.st-field-full{grid-column:1/-1}
@media (max-width:640px){ .st-grid{grid-template-columns:1fr} }

/* Inputs */
.st-label{display:block;font-size:12px;margin:6px 0;color:var(--st-sub)}
.st-input{
  width:100%; padding:12px 14px; border-radius:12px;
  background:#0b1220; color:var(--st-text);
  border:1px solid var(--st-border); line-height:1.35;
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  text-shadow:none; font-weight:600;
}
.st-select{height:48px; display:block}
.st-input-lg{padding:16px 16px;border-radius:14px}
#st-page-message{min-height:140px}
.st-input:focus{outline:none;border-color:var(--st-accent);box-shadow:0 0 0 3px rgba(37,99,235,.2)}
.st-input option{background:#0b1220;color:var(--st-text)}
select.st-input:-moz-focusring { color: var(--st-text); text-shadow:none; }

/* Create form spacing */
.st-create-actions{margin-top:16px}

/* Buttons + status */
.st-btn{padding:10px 14px;border:0;border-radius:12px;background:var(--st-accent);color:#fff;cursor:pointer;font-weight:700}
.st-btn-lg{width:100%;padding:14px 16px;border-radius:14px}
.st-status{margin-left:10px;font-size:12px;color:var(--st-sub)}
.st-status.st-ok{color:var(--st-ok)} .st-status.st-err{color:var(--st-err)}
.st-empty{color:var(--st-sub);padding:6px 2px}

/* List */
.st-list-head h2,.st-create-head h2{font-size:28px;font-weight:800;margin:0 0 4px}
.st-ticket-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.st-ticket-item{background:var(--st-panel);border-radius:12px;padding:12px;border:1px solid var(--st-border)}
.st-ticket-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.st-badges{display:flex;gap:6px}

/* Status badges */
.st-badge{font-size:12px;padding:2px 10px;border-radius:999px;border:1px solid var(--st-border);font-weight:700}
.st-badge.st-open{background:#2563eb;color:#fff}
.st-badge.st-resolved{background:#22c55e;color:#06200f}
.st-badge.st-closed{background:#ef4444;color:#fff}

/* Reply Tag (Admin / Customer) */
.st-tag{padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid var(--st-border)}
.st-tag-admin{background:#9333ea;color:#fff}
.st-tag-customer{background:#f59e0b;color:#1f1200}

.st-ticket-meta{display:flex;gap:10px;font-size:12px;color:var(--st-sub);margin-bottom:8px;flex-wrap:wrap}
.st-subject{background:#0f172a;padding:2px 8px;border-radius:999px;border:1px solid var(--st-border)}
.st-order{background:#132036;padding:2px 8px;border-radius:999px;border:1px solid var(--st-border)}

/* Attachments grid */
.st-attach-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.st-attach img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--st-border)}

/* Thread */
.st-thread-wrap{margin-top:10px}
.st-thread-toggle{background:transparent;color:#fff;border:1px dashed var(--st-accent);padding:6px 10px;border-radius:999px;cursor:pointer;font-weight:800}
.st-thread{margin-top:10px}
.st-replies{display:flex;flex-direction:column;gap:8px}
.st-reply{max-width:78%;border-radius:12px;padding:10px;border:1px solid var(--st-border);box-shadow:0 6px 18px rgba(0,0,0,.25)}
.st-reply.st-user{margin-left:auto;background:var(--st-user)}
.st-reply.st-admin{margin-right:auto;background:var(--st-admin)}
.st-reply-head{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#e2e8f0;margin-bottom:4px}
.st-reply-body p{margin:0}
.st-reply-form{margin-top:12px}
.st-reply-form .st-input{margin-top:8px}
.st-reply-actions{display:flex;align-items:center;gap:10px;margin-top:10px}

/* Hide any theme title */
.entry-title,.page-title,.wp-block-post-title,h1.entry-title,h1.page-title{display:none!important}

/* Force big reply box like create-message */
textarea.st-reply-text.st-input.st-input-lg {
  min-height: 160px !important;   /* আপনার পছন্দমতো 140–220px */
  height: 160px !important;        /* থিমের fixed-height override */
  line-height: 1.5;
  resize: vertical;                /* ইউজার চাইলে টেনে বড়/ছোট করতে পারবে */
  box-sizing: border-box;
  display: block;
  width: 100%;
}

/* নিরাপত্তা হিসেবে: কোনো গ্লোবাল সিলেক্ট-স্টাইল যেন textarea-তে না লাগে */
textarea.st-input { height: auto !important; }

/* ==== FAB Styles ==== */
#st-support-fab {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: #7d6dff; /* নরমাল রঙ */
  color: #fff;
  border-radius: 999px;
  padding: 12px 20px;
  font-weight: 700;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,.2);
  cursor: pointer;
  z-index: 9999;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
}
#st-support-fab:hover {
  background: #2663eb; /* হোভার রঙ */
}
#st-support-fab svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

/* ==== Hide on Mobile ==== */
@media (max-width: 767px) {
  #st-support-fab {
    display: none !important;
  }
}