/* =============================================================
   Creet Loyalty — loyalty.css
   Prefix: creet-ly-
   ============================================================= */

/* ── Shared / Reset ─────────────────────────────────────────── */
.creet-ly-wrap *,
.creet-ly-account-wrap * {
    box-sizing: border-box;
}

/* ── Admin Wrap ─────────────────────────────────────────────── */
.creet-ly-wrap {
    font-family: var(--cds-font-body);
    max-width: 100%;
    margin: 0 auto;
    padding: var(--cds-space-5) var(--cds-space-5) var(--cds-space-10);
    direction: rtl;
}

/* ── Header ─────────────────────────────────────────────────── */
.creet-ly-header {
    background: var(--cds-gradient-header);
    border-radius: var(--cds-radius-xl);
    padding: var(--cds-space-7) var(--cds-space-8);
    margin-bottom: var(--cds-space-7);
    color: var(--cds-text-inverse);
}

.creet-ly-header-inner {
    display: flex;
    align-items: center;
    gap: var(--cds-space-4);
}

.creet-ly-header-icon {
    width: 56px;
    height: 56px;
    background: var(--cds-brand-soft);
    border-radius: var(--cds-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cds-brand);
    flex-shrink: 0;
}

.creet-ly-header-title {
    font-size: 26px;
    font-weight: var(--cds-weight-bold);
    color: var(--cds-text-inverse);
    margin: 0 0 var(--cds-space-1);
    padding: 0;
    border: none;
    line-height: var(--cds-leading-tight);
}

.creet-ly-header-sub {
    color: rgba(255,255,255,0.6);
    font-size: var(--cds-text-md);
    margin: 0;
}

/* ── Stats Cards ────────────────────────────────────────────── */
.creet-ly-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--cds-space-4);
    margin-bottom: var(--cds-space-6);
}

.creet-ly-stat-card {
    background: var(--cds-bg-surface);
    border: 1px solid var(--cds-border);
    border-radius: var(--cds-radius-lg);
    padding: var(--cds-space-5);
    display: flex;
    align-items: center;
    gap: var(--cds-space-4);
    transition: box-shadow 0.2s;
}

.creet-ly-stat-card:hover {
    box-shadow: var(--cds-shadow-md);
}

.creet-ly-stat-icon {
    width: 48px;
    height: 48px;
    background: var(--cds-gradient-header);
    border-radius: var(--cds-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cds-brand);
    flex-shrink: 0;
}

.creet-ly-stat-value {
    font-size: var(--cds-text-3xl);
    font-weight: var(--cds-weight-bold);
    color: var(--cds-text);
    line-height: var(--cds-leading-none);
}

.creet-ly-stat-label {
    font-size: var(--cds-text-base);
    color: var(--cds-text-subtle);
    margin-top: var(--cds-space-1);
}

/* ── Tabs ───────────────────────────────────────────────────── */
.creet-ly-tabs {
    display: flex;
    gap: var(--cds-space-1);
    background: var(--cds-bg-surface-2);
    border: 1px solid var(--cds-border);
    border-radius: var(--cds-radius-lg);
    padding: 6px;
    margin-bottom: var(--cds-space-6);
}

.creet-ly-tab {
    display: flex;
    align-items: center;
    gap: var(--cds-space-2);
    padding: 10px var(--cds-space-5);
    border-radius: var(--cds-radius-md);
    text-decoration: none;
    color: var(--cds-text-subtle);
    font-size: var(--cds-text-md);
    font-weight: var(--cds-weight-medium);
    transition: all 0.2s;
}

.creet-ly-tab:hover {
    background: var(--cds-bg-surface);
    color: var(--cds-text);
}

.creet-ly-tab.active {
    background: var(--cds-gradient-header);
    color: var(--cds-brand);
    font-weight: var(--cds-weight-semibold);
}

.creet-ly-tab-content {
    /* container for tab panels */
}

/* ── Card ───────────────────────────────────────────────────── */
.creet-ly-card {
    background: var(--cds-bg-surface);
    border: 1px solid var(--cds-border);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: var(--cds-space-5);
}

.creet-ly-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: var(--cds-space-4) var(--cds-space-6);
    background: var(--cds-bg-inverse);
    color: var(--cds-brand);
    font-size: 15px;
    font-weight: var(--cds-weight-semibold);
}

.creet-ly-card-body {
    padding: var(--cds-space-6);
}

/* ── Form Grid ──────────────────────────────────────────────── */
.creet-ly-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--cds-space-6);
    margin-bottom: var(--cds-space-6);
}

.creet-ly-form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.creet-ly-label {
    font-size: var(--cds-text-base);
    font-weight: var(--cds-weight-semibold);
    color: var(--cds-text-muted);
}

.creet-ly-input-group {
    display: flex;
    align-items: center;
    gap: 0;
}

.creet-ly-input {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid var(--cds-border-strong);
    border-radius: var(--cds-radius-md);
    font-size: var(--cds-text-md);
    color: var(--cds-text);
    background: var(--cds-bg-surface);
    transition: border-color 0.2s;
    outline: none;
    direction: ltr;
}

.creet-ly-input-group .creet-ly-input {
    border-radius: 0 var(--cds-radius-md) var(--cds-radius-md) 0;
    flex: 0 0 100px;
    width: 100px;
}

.creet-ly-input:focus {
    border-color: var(--cds-brand);
    box-shadow: 0 0 0 3px rgba(195, 253, 115, 0.2);
}

.creet-ly-input-suffix {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    background: var(--cds-bg-surface-2);
    border: 1.5px solid var(--cds-border-strong);
    border-radius: var(--cds-radius-md) 0 0 var(--cds-radius-md);
    border-inline-end: none;
    font-size: var(--cds-text-base);
    color: var(--cds-text-subtle);
    white-space: nowrap;
}

.creet-ly-hint {
    font-size: var(--cds-text-sm);
    color: var(--cds-text-subtle);
    margin: 0;
}

/* ── Buttons ────────────────────────────────────────────────── */
.creet-ly-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--cds-space-2);
    padding: 10px var(--cds-space-5);
    border-radius: var(--cds-radius-md);
    font-size: var(--cds-text-md);
    font-weight: var(--cds-weight-semibold);
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.creet-ly-btn-primary {
    background: var(--cds-brand);
    color: var(--cds-brand-fg);
}

.creet-ly-btn-primary .creet-icon,
.creet-ly-btn-primary span {
    color: var(--cds-brand-fg) !important;
}

.creet-ly-btn-primary:hover {
    background: var(--cds-brand-bold);
    transform: translateY(-1px);
    box-shadow: var(--cds-shadow-brand);
    color: var(--cds-brand-fg);
}

/* Checkout box: use store colors instead of admin lime green */
.creet-ly-checkout-box .creet-ly-btn-primary {
    background: var(--ly-primary);
    color: var(--ly-on-primary, #fff);
}

.creet-ly-checkout-box .creet-ly-btn-primary:hover {
    background: var(--ly-primary);
    filter: brightness(0.88);
    box-shadow: 0 4px 12px rgba(var(--ly-primary-rgb), 0.35);
    color: var(--ly-on-primary, #fff);
}

.creet-ly-btn-ghost {
    background: transparent;
    color: var(--cds-text-subtle);
    border: 1.5px solid var(--cds-border-strong);
}

.creet-ly-btn-ghost:hover {
    border-color: var(--cds-text-subtle);
    color: var(--cds-text-muted);
}

.creet-ly-btn-sm {
    padding: 6px var(--cds-space-3);
    font-size: var(--cds-text-sm);
}

.creet-ly-form-actions {
    display: flex;
    gap: var(--cds-space-3);
    align-items: center;
}

/* ── Notice ─────────────────────────────────────────────────── */
.creet-ly-notice {
    padding: var(--cds-space-3) var(--cds-space-4);
    border-radius: var(--cds-radius-md);
    font-size: var(--cds-text-md);
    margin-bottom: var(--cds-space-5);
    border: 1px solid transparent;
}

.creet-ly-notice.success {
    background: var(--cds-success-bg);
    border-color: var(--cds-success-border);
    color: var(--cds-success-fg);
}

.creet-ly-notice.error {
    background: var(--cds-danger-bg);
    border-color: var(--cds-danger-border);
    color: var(--cds-danger);
}

/* ── Customers Table ────────────────────────────────────────── */
.creet-ly-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--cds-text-md);
}

.creet-ly-table thead tr {
    background: var(--cds-bg-inverse);
}

.creet-ly-table th {
    padding: var(--cds-space-3) var(--cds-space-4);
    text-align: right;
    font-size: var(--cds-text-sm);
    font-weight: var(--cds-weight-semibold);
    color: var(--cds-brand);
    text-transform: uppercase;
    letter-spacing: var(--cds-tracking-wider);
}

.creet-ly-table td {
    padding: 14px var(--cds-space-4);
    border-bottom: 1px solid var(--cds-border-subtle);
    color: var(--cds-text-muted);
    vertical-align: top;
}

.creet-ly-table tbody tr:hover {
    background: var(--cds-bg-surface-2);
}

.creet-ly-customer-cell {
    display: flex;
    align-items: center;
    gap: var(--cds-space-3);
}

.creet-ly-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--cds-gradient-header);
    color: var(--cds-brand);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: var(--cds-weight-bold);
    font-size: var(--cds-text-md);
    flex-shrink: 0;
}

.creet-ly-customer-name {
    font-weight: var(--cds-weight-semibold);
    color: var(--cds-text);
    font-size: var(--cds-text-md);
}

.creet-ly-customer-email {
    font-size: var(--cds-text-sm);
    color: var(--cds-text-subtle);
    word-break: break-all;
    overflow-wrap: break-word;
}

.creet-ly-points-badge {
    display: inline-block;
    background: var(--cds-brand-soft);
    color: var(--cds-success-fg);
    border: 1px solid var(--cds-brand-soft-strong);
    padding: 3px 10px;
    border-radius: var(--cds-radius-2xl);
    font-size: var(--cds-text-base);
    font-weight: var(--cds-weight-bold);
}

/* ── Inline Adjust Form ─────────────────────────────────────── */
.creet-ly-adjust-form {
    margin-top: var(--cds-space-3);
    border: 1px solid var(--cds-border);
    border-radius: 10px;
    overflow: hidden;
}

.creet-ly-adjust-inner {
    padding: var(--cds-space-4);
    background: var(--cds-bg-surface-2);
}

.creet-ly-adjust-inner h4 {
    margin: 0 0 14px;
    font-size: var(--cds-text-md);
    color: var(--cds-text);
    font-weight: var(--cds-weight-semibold);
}

.creet-ly-adjust-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--cds-space-3);
    margin-bottom: var(--cds-space-3);
}

/* ── Empty States ───────────────────────────────────────────── */
.creet-ly-empty {
    text-align: center;
    padding: var(--cds-space-10) var(--cds-space-5);
    color: var(--cds-text-subtle);
}

.creet-ly-empty svg {
    display: block;
    margin: 0 auto var(--cds-space-3);
    opacity: 0.4;
}

.creet-ly-empty p {
    margin: 0;
    font-size: var(--cds-text-md);
}

/* ── Enable/Disable Toggle Card ─────────────────────────────── */
.creet-ly-toggle-card {
    margin-bottom: var(--cds-space-4);
}

.creet-ly-toggle-card-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--cds-space-4);
    flex-wrap: wrap;
    padding: 18px var(--cds-space-6) !important;
}

.creet-ly-toggle-info {
    display: flex;
    align-items: center;
    gap: 14px;
}

.creet-ly-toggle-icon {
    width: 44px;
    height: 44px;
    border-radius: var(--cds-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.3s, color 0.3s;
}

.creet-ly-toggle-icon--on {
    background: rgba(34, 197, 94, 0.15);
    color: var(--cds-success);
}

.creet-ly-toggle-icon--off {
    background: rgba(239, 68, 68, 0.12);
    color: var(--cds-danger);
}

.creet-ly-toggle-label {
    font-size: 15px;
    font-weight: var(--cds-weight-bold);
    color: var(--cds-text);
    margin-bottom: 3px;
}

.creet-ly-toggle-desc {
    font-size: var(--cds-text-base);
    color: var(--cds-text-subtle);
}

.creet-ly-toggle-controls {
    display: flex;
    align-items: center;
    gap: 14px;
}

/* Status pill */
.creet-ly-status-pill {
    display: inline-block;
    padding: var(--cds-space-1) 14px;
    border-radius: var(--cds-radius-2xl);
    font-size: var(--cds-text-base);
    font-weight: var(--cds-weight-semibold);
    transition: background 0.3s, color 0.3s;
}

.creet-ly-status-pill--on {
    background: rgba(34, 197, 94, 0.12);
    color: var(--cds-success);
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.creet-ly-status-pill--off {
    background: rgba(239, 68, 68, 0.1);
    color: var(--cds-danger);
    border: 1px solid rgba(239, 68, 68, 0.25);
}

/* Toggle switch */
.creet-ly-switch {
    position: relative;
    width: 52px;
    height: 28px;
    background: var(--cds-border-strong);
    border-radius: 14px;
    border: none;
    cursor: pointer;
    transition: background 0.25s;
    padding: 0;
    flex-shrink: 0;
}

.creet-ly-switch--on {
    background: var(--cds-success);
}

.creet-ly-switch-knob {
    position: absolute;
    top: 3px;
    inset-inline-start: 3px;
    width: 22px;
    height: 22px;
    background: var(--cds-bg-surface);
    border-radius: 50%;
    box-shadow: var(--cds-shadow-sm);
    transition: inset-inline-start 0.25s;
    display: block;
}

.creet-ly-switch--on .creet-ly-switch-knob {
    inset-inline-start: 27px;
}

/* ── Checkout Box ───────────────────────────────────────────── */
.creet-ly-checkout-box {
    --ly-primary:     #00838f;
    --ly-primary-rgb: 0,131,143;
    --ly-secondary:   #0f172a;
    background: var(--cds-bg-surface);
    border: 1.5px solid var(--cds-border);
    border-inline-start: 4px solid var(--ly-primary);
    border-radius: 10px;
    margin-bottom: var(--cds-space-5);
    overflow: hidden;
    direction: rtl;
}

.creet-ly-box-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: var(--cds-bg-surface-2);
    border-bottom: 1px solid var(--cds-border);
    font-size: var(--cds-text-md);
    font-weight: var(--cds-weight-semibold);
    color: var(--cds-text);
}

.creet-ly-box-header svg {
    color: var(--ly-primary, #C3FD73);
    flex-shrink: 0;
}

.creet-ly-box-body {
    padding: var(--cds-space-4) 18px;
    font-size: var(--cds-text-md);
    color: var(--cds-text-muted);
}

.creet-ly-box-body p {
    margin: 0 0 var(--cds-space-3);
}

.creet-ly-box-body--muted {
    color: var(--cds-text-subtle);
    font-size: var(--cds-text-base);
}

.creet-ly-applied-msg {
    display: flex;
    align-items: center;
    gap: var(--cds-space-2);
    color: var(--cds-success-fg);
    font-weight: var(--cds-weight-semibold);
    margin-bottom: var(--cds-space-2);
    font-size: var(--cds-text-md);
}

.creet-ly-cap-notice {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    background: var(--cds-warning-bg);
    border: 1px solid var(--cds-warning-border);
    border-radius: var(--cds-radius-md);
    padding: 9px var(--cds-space-3);
    font-size: var(--cds-text-sm);
    color: var(--cds-warning-fg);
    font-weight: var(--cds-weight-medium);
    margin-bottom: 10px;
    line-height: var(--cds-leading-normal);
}
.creet-ly-cap-notice svg { flex-shrink: 0; margin-top: 1px; }

.creet-ly-checkout-msg {
    margin-top: 10px;
    padding: 10px 14px;
    border-radius: var(--cds-radius-sm);
    font-size: var(--cds-text-base);
}

.creet-ly-checkout-msg.success {
    background: var(--cds-success-bg);
    color: var(--cds-success-fg);
    border: 1px solid var(--cds-success-border);
}

.creet-ly-checkout-msg.error {
    background: var(--cds-danger-bg);
    color: var(--cds-danger);
    border: 1px solid var(--cds-danger-border);
}

/* ── My Account Tab ─────────────────────────────────────────── */
.creet-ly-account-wrap {
    --ly-primary:     #C3FD73;
    --ly-secondary:   #0f172a;
    --ly-primary-rgb: 195,253,115;
    direction: rtl;
    font-family: var(--cds-font-body);
}

.creet-ly-balance-card {
    background: linear-gradient(135deg, #000 0%, color-mix(in srgb, var(--ly-secondary, #0f172a) 90%, #000) 60%, color-mix(in srgb, var(--ly-secondary, #16213e) 80%, #000) 100%);
    border-radius: var(--cds-radius-xl);
    padding: var(--cds-space-8);
    display: flex;
    align-items: center;
    gap: var(--cds-space-6);
    margin-bottom: var(--cds-space-5);
    color: var(--cds-text-inverse);
}

.creet-ly-balance-icon {
    width: 72px;
    height: 72px;
    background: rgba(var(--ly-primary-rgb, 195,253,115), 0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ly-primary, #C3FD73);
    flex-shrink: 0;
}

.creet-ly-balance-value {
    font-size: 52px;
    font-weight: var(--cds-weight-black);
    color: var(--ly-primary, #C3FD73);
    line-height: var(--cds-leading-none);
}

.creet-ly-balance-label {
    font-size: var(--cds-text-lg);
    color: rgba(255,255,255,0.7);
    margin-top: var(--cds-space-1);
}

.creet-ly-balance-equiv {
    font-size: var(--cds-text-base);
    color: rgba(255,255,255,0.5);
    margin-top: 6px;
}

/* Info Box */
.creet-ly-info-box {
    background: rgba(var(--ly-primary-rgb, 195,253,115), 0.08);
    border: 1px solid rgba(var(--ly-primary-rgb, 195,253,115), 0.35);
    border-radius: var(--cds-radius-lg);
    padding: var(--cds-space-5);
    margin-bottom: var(--cds-space-5);
}

.creet-ly-info-box-header {
    display: flex;
    align-items: center;
    gap: var(--cds-space-2);
    font-size: var(--cds-text-md);
    font-weight: var(--cds-weight-bold);
    color: var(--ly-secondary, #0f172a);
    margin-bottom: var(--cds-space-3);
}

.creet-ly-info-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--cds-space-2);
}

.creet-ly-info-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--cds-text-base);
    color: var(--cds-text-muted);
}

.creet-ly-info-list svg {
    color: var(--ly-primary, #C3FD73);
    flex-shrink: 0;
}

/* Account card */
.creet-ly-account-card {
    background: var(--cds-bg-surface);
    border: 1px solid var(--cds-border);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: var(--cds-space-5);
}

.creet-ly-account-card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px var(--cds-space-5);
    background: var(--ly-secondary, #0f172a);
    color: var(--ly-primary, #C3FD73);
    font-size: var(--cds-text-md);
    font-weight: var(--cds-weight-semibold);
}

/* History Table */
.creet-ly-history-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--cds-text-md);
}

.creet-ly-history-table thead tr {
    background: var(--ly-secondary, #0f172a);
}

.creet-ly-history-table th {
    padding: 11px var(--cds-space-4);
    text-align: right;
    font-size: var(--cds-text-sm);
    font-weight: var(--cds-weight-semibold);
    color: var(--ly-primary, #C3FD73);
    text-transform: uppercase;
    letter-spacing: var(--cds-tracking-wider);
}

.creet-ly-history-table td {
    padding: 13px var(--cds-space-4);
    border-bottom: 1px solid var(--cds-border-subtle);
    color: var(--cds-text-muted);
    vertical-align: middle;
}

.creet-ly-history-table tbody tr:hover {
    background: var(--cds-bg-surface-2);
}

.creet-ly-history-date {
    font-size: var(--cds-text-sm);
    color: var(--cds-text-subtle);
    white-space: nowrap;
}

.creet-ly-history-points {
    font-size: 15px;
    font-weight: var(--cds-weight-bold);
}

.creet-ly-points-positive {
    color: var(--cds-success);
}

.creet-ly-points-negative {
    color: var(--cds-danger);
}

.creet-ly-empty-account {
    text-align: center;
    padding: var(--cds-space-10) var(--cds-space-5);
    color: var(--cds-text-subtle);
}

.creet-ly-empty-account svg {
    display: block;
    margin: 0 auto var(--cds-space-3);
    opacity: 0.3;
}

.creet-ly-empty-account p {
    margin: 0;
    font-size: var(--cds-text-md);
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    .creet-ly-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .creet-ly-stat-card {
        flex-direction: column;
        align-items: flex-start;
        padding: var(--cds-space-3);
        gap: var(--cds-space-2);
    }
    .creet-ly-stat-icon {
        width: 36px;
        height: 36px;
        border-radius: var(--cds-radius-md);
    }
    .creet-ly-stat-label {
        font-size: var(--cds-text-xs);
    }
    .creet-ly-stat-value {
        font-size: var(--cds-text-lg);
    }
    .creet-ly-form-grid {
        grid-template-columns: 1fr;
    }
    .creet-ly-adjust-row {
        grid-template-columns: 1fr;
    }
    .creet-ly-balance-card {
        flex-direction: column;
        text-align: center;
    }
    .creet-ly-balance-value {
        font-size: 40px;
    }
    .creet-ly-tabs {
        flex-direction: column;
    }
}

@media (max-width: 782px) {
    .creet-ly-table thead { display: none !important; }
    .creet-ly-table,
    .creet-ly-table tbody { display: block !important; width: 100% !important; }
    .creet-ly-table tbody tr {
        display: block !important;
        padding: 14px var(--cds-space-4) !important;
        border-bottom: 2px solid var(--cds-border) !important;
        width: 100% !important;
    }
    .creet-ly-table tbody tr:hover { background: var(--cds-bg-surface-2) !important; }
    .creet-ly-table td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
        padding: 7px 0 !important;
        border: none !important;
        border-bottom: 1px solid var(--cds-bg-surface-2) !important;
        font-size: var(--cds-text-base) !important;
        width: 100% !important;
    }
    .creet-ly-table td::before {
        content: attr(data-label);
        font-weight: var(--cds-weight-bold);
        color: var(--cds-text-subtle);
        font-size: var(--cds-text-sm);
        flex-shrink: 0;
        margin-inline-start: var(--cds-space-3);
        padding-top: 3px;
        min-width: 80px;
    }
    /* Actions cell: stack button + form vertically */
    .creet-ly-table td:last-child {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: var(--cds-space-2) !important;
    }
    .creet-ly-table td:last-child::before {
        display: none !important;
    }
    .creet-ly-adjust-form {
        width: 100% !important;
    }
}

/* ---- Help Box ---- */
.creet-help-box{background:var(--cds-gradient-header);border:2px solid var(--cds-brand-soft);border-radius:var(--cds-radius-xl);margin:0 0 var(--cds-space-5);overflow:hidden;position:relative;transition:border-color .3s,box-shadow .3s}.creet-help-box::before{content:"";position:absolute;top:-60%;right:-10%;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(195,253,115,.08) 0%,transparent 70%);pointer-events:none}.creet-help-box:hover{border-color:var(--cds-brand-soft-strong)}.creet-help-box--open{border-color:var(--cds-brand);box-shadow:0 4px 24px rgba(195,253,115,.1)}.creet-help-toggle{display:flex;align-items:center;gap:var(--cds-space-3);width:100%;padding:var(--cds-space-4) var(--cds-space-6);border:none;background:transparent;cursor:pointer;font-size:var(--cds-text-md);font-weight:var(--cds-weight-bold);color:rgba(255,255,255,.85);font-family:inherit;text-align:inherit;position:relative;z-index:var(--cds-z-base);transition:color .2s}.creet-help-toggle:hover{color:var(--cds-text-inverse)}.creet-help-toggle-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--cds-radius-md);background:var(--cds-brand-soft);color:var(--cds-brand);flex-shrink:0}.creet-help-box:hover .creet-help-toggle-icon,.creet-help-box--open .creet-help-toggle-icon{background:var(--cds-brand-soft-strong)}.creet-help-toggle-label{flex:1}.creet-help-chevron{transition:transform .3s ease;color:rgba(195,253,115,.5);flex-shrink:0}.creet-help-box--open .creet-help-chevron{transform:rotate(180deg);color:var(--cds-brand)}.creet-help-content{overflow:hidden;height:0;transition:height .35s ease}.creet-help-content>.creet-help-grid{padding:0 var(--cds-space-6) var(--cds-space-6)}.creet-help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--cds-space-3)}.creet-help-item{display:flex;gap:var(--cds-space-3);align-items:flex-start;padding:var(--cds-space-4);background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--cds-radius-lg);transition:background .2s,border-color .2s}.creet-help-item:hover{background:rgba(195,253,115,.06);border-color:rgba(195,253,115,.2)}.creet-help-step{display:flex;align-items:center;justify-content:center;width:30px;height:30px;min-width:30px;border-radius:50%;background:var(--cds-brand);color:var(--cds-brand-fg);font-size:var(--cds-text-base);font-weight:var(--cds-weight-black);flex-shrink:0}.creet-help-item strong{display:block;font-size:var(--cds-text-base);font-weight:var(--cds-weight-bold);color:var(--cds-brand);margin-bottom:var(--cds-space-1)}.creet-help-item p{font-size:12.5px;line-height:var(--cds-leading-relaxed);color:rgba(255,255,255,.55);margin:0}@media(max-width:960px){.creet-help-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:782px){.creet-help-toggle{padding:14px var(--cds-space-4);font-size:var(--cds-text-base);gap:10px}.creet-help-toggle-icon{width:32px;height:32px}.creet-help-content>.creet-help-grid{padding:0 var(--cds-space-3) var(--cds-space-4)}.creet-help-grid{grid-template-columns:1fr;gap:var(--cds-space-2)}.creet-help-box{margin:0 0 var(--cds-space-3);border-radius:var(--cds-radius-lg)}.creet-help-item{padding:var(--cds-space-3) 14px;gap:10px}.creet-help-step{width:26px;height:26px;min-width:26px;font-size:var(--cds-text-sm)}.creet-help-item strong{font-size:12.5px}.creet-help-item p{font-size:11.5px}}