/* StudyWox Coins Plugin — Frontend Styles */

/* ── Balance bar ── */
.sw-balance-bar{display:flex;align-items:center;gap:10px;background:#EBF2FF;border:1px solid #C3D9FF;border-radius:10px;padding:14px 20px;margin-bottom:24px;font-size:15px}
.sw-balance-icon{font-size:22px}
.sw-balance-text strong{color:#1A56DB;font-size:18px}
.sw-live-balance{font-size:15px;font-weight:600;color:#1A56DB;background:#EBF2FF;padding:6px 14px;border-radius:20px;display:inline-block}

/* ── Coin packs grid ── */
.sw-packs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;margin-bottom:24px}
.sw-pack{background:#fff;border:2px solid #E5E7EB;border-radius:14px;padding:28px 20px;text-align:center;position:relative;transition:border-color .2s,box-shadow .2s}
.sw-pack:hover{border-color:#F59E0B;box-shadow:0 6px 24px rgba(245,158,11,.15)}
.sw-pack--popular{border-color:#F59E0B;box-shadow:0 4px 16px rgba(245,158,11,.15)}
.sw-pack__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#F59E0B;color:#fff;font-size:11px;font-weight:700;padding:4px 14px;border-radius:20px;white-space:nowrap}
.sw-pack__coins{font-size:36px;font-weight:800;color:#F59E0B;margin:8px 0 4px}
.sw-pack__unit{font-size:12px;color:#9CA3AF;font-weight:600;margin-bottom:4px}
.sw-pack__label{font-size:13px;font-weight:600;color:#6B7280;margin-bottom:12px}
.sw-pack__price{font-size:22px;font-weight:800;color:#111827;margin-bottom:16px}
.sw-pack__btn{width:100%;padding:12px;background:#1A56DB;color:#fff;font-weight:700;font-size:14px;border:none;border-radius:8px;cursor:pointer;font-family:inherit;transition:background .2s}
.sw-pack__btn:hover{background:#1344B8}
.sw-pack__btn:disabled{background:#9CA3AF;cursor:not-allowed}

/* ── Messages ── */
.sw-msg{padding:12px 16px;border-radius:8px;font-size:14px;font-weight:600;margin-top:12px}
.sw-msg--success{background:#ECFDF5;color:#065F46;border:1px solid #A7F3D0}
.sw-msg--error{background:#FEF2F2;color:#991B1B;border:1px solid #FCA5A5}
.sw-login-notice{background:#EBF2FF;border:1px solid #C3D9FF;border-radius:8px;padding:14px 18px;font-size:14px}
.sw-login-notice a{color:#1A56DB;font-weight:600}

/* ── Transaction history table ── */
.sw-history{margin-top:32px}
.sw-history__title{font-size:18px;font-weight:700;margin-bottom:14px}
.sw-history__empty{color:#9CA3AF;font-size:14px}
.sw-history__table{width:100%;border-collapse:collapse;font-size:13px}
.sw-history__table th{background:#F8FAFC;padding:10px 14px;text-align:left;border-bottom:2px solid #E5E7EB;font-weight:600;color:#4B5563}
.sw-history__table td{padding:10px 14px;border-bottom:1px solid #E5E7EB;vertical-align:top}
.sw-history__table small{color:#9CA3AF;display:block;margin-top:2px}
.sw-add{color:#059669;font-weight:700}
.sw-deduct{color:#DC2626;font-weight:700}

/* ── Hire button ── */
.sw-hire-wrap{margin:16px 0}
.sw-hire-balance{font-size:13px;color:#6B7280;margin-bottom:10px}
.sw-hire-btn{display:inline-block;padding:13px 24px;background:#1A56DB;color:#fff;font-weight:700;font-size:14px;border:none;border-radius:9px;cursor:pointer;font-family:inherit;text-decoration:none;transition:background .2s}
.sw-hire-btn:hover{background:#1344B8}
.sw-hire-btn--active{background:#1A56DB}
.sw-hire-btn--buy{background:#F59E0B;color:#fff}
.sw-hire-btn--buy:hover{background:#D97706}
.sw-hire-msg{margin-top:10px;font-size:14px}

/* ── Payout form ── */
.sw-earnings-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px}
.sw-earn-stat{background:#F8FAFC;border:1px solid #E5E7EB;border-radius:10px;padding:18px;text-align:center}
.sw-earn-stat__label{display:block;font-size:12px;color:#6B7280;font-weight:600;margin-bottom:6px;text-transform:uppercase;letter-spacing:.05em}
.sw-earn-stat__value{display:block;font-size:22px;font-weight:800;color:#111827}
.sw-earn-stat__value--green{color:#059669}
.sw-payout-form{background:#fff;border:1.5px solid #E5E7EB;border-radius:14px;padding:28px;margin-bottom:24px}
.sw-payout-form h3{margin:0 0 20px;font-size:17px;font-weight:700}
.sw-field{margin-bottom:16px}
.sw-field label{display:block;font-size:13px;font-weight:600;color:#4B5563;margin-bottom:6px}
.sw-field input,.sw-field select,.sw-field textarea{width:100%;padding:10px 14px;border:1.5px solid #E5E7EB;border-radius:8px;font-size:14px;font-family:inherit;outline:none}
.sw-field input:focus,.sw-field select:focus{border-color:#1A56DB;box-shadow:0 0 0 3px rgba(26,86,219,.1)}
.sw-field-hint{font-size:13px;color:#6B7280;margin-top:6px;display:block}
.sw-payout-btn{padding:13px 28px;background:#059669;color:#fff;font-weight:700;font-size:15px;border:none;border-radius:9px;cursor:pointer;font-family:inherit;transition:background .2s}
.sw-payout-btn:hover{background:#047857}
.sw-payout-btn:disabled{background:#9CA3AF;cursor:not-allowed}
.sw-payout-locked{background:#FFF8EC;border:1.5px solid #FDE68A;border-radius:10px;padding:20px;color:#78350F;font-size:14px}
.sw-payout-history h3{font-size:17px;font-weight:700;margin-bottom:14px}
.sw-status{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700}
.sw-status--pending{background:#FFF8EC;color:#92400E}
.sw-status--approved{background:#EBF2FF;color:#1A56DB}
.sw-status--paid{background:#ECFDF5;color:#065F46}
.sw-status--rejected{background:#FEF2F2;color:#991B1B}

@media(max-width:600px){
    .sw-packs-grid{grid-template-columns:1fr 1fr}
    .sw-earnings-summary{grid-template-columns:1fr}
}
@media(max-width:420px){
    .sw-packs-grid{grid-template-columns:1fr}
    .sw-history__table{font-size:12px}
}