:root,
[data-theme="orange"] {
    color-scheme: light;

    /* Brand */
    --app-primary: #ff6a00;
    --app-primary-dark: #e85f00;
    --app-primary-soft: #fff3e8;
    --app-primary-soft-2: #fff7ed;
    --app-primary-border: #ffbf8a;
    --app-primary-border-soft: #fed7aa;
    --app-primary-rgb: 255, 106, 0;

    /* Compatibility aliases for older CSS that still uses --tp-* */
    --tp-primary: var(--app-primary);
    --tp-primary-dark: var(--app-primary-dark);
    --tp-primary-soft: var(--app-primary-soft);
    --tp-primary-border: var(--app-primary-border);

    /* App surfaces */
    --app-bg: #f5f7fb;
    --app-bg-soft: #f3f5f8;
    --app-surface: #ffffff;
    --app-surface-soft: #f8fafc;
    --app-surface-muted: #f1f5f9;
    --app-header-bg: rgba(255, 255, 255, .94);
    --app-sidebar-bg: #eef2f7;

    /* Text */
    --app-text: #111827;
    --app-text-strong: #0f172a;
    --app-text-muted: #64748b;
    --app-text-soft: #94a3b8;

    /* Borders */
    --app-border: #e5e7eb;
    --app-border-soft: #edf0f5;
    --app-border-strong: #dbe3ef;

    /* Shadows */
    --app-shadow-xs: 0 2px 10px rgba(15, 23, 42, .05);
    --app-shadow-sm: 0 4px 18px rgba(15, 23, 42, .05);
    --app-shadow-md: 0 8px 28px rgba(15, 23, 42, .08);
    --app-shadow-primary: 0 8px 20px rgba(var(--app-primary-rgb), .22);

    /* Semantic colors */
    --app-success: #16a34a;
    --app-success-soft: #ecfdf3;
    --app-info: #0284c7;
    --app-info-soft: #e8f7ff;
    --app-warning: #d97706;
    --app-warning-soft: #fff7ed;
    --app-danger: #dc2626;
    --app-danger-soft: #fff0f0;
    --app-danger-border: #fecaca;
    --app-purple: #7e22ce;
    --app-purple-soft: #f4ecff;

    /* Layout */
    --app-sidebar-width: 292px;
    --app-sidebar-collapsed-width: 76px;
    --app-topbar-height: 64px;
    --app-page-max-width: 1540px;

    /* Radius */
    --app-radius-sm: 10px;
    --app-radius-md: 14px;
    --app-radius-lg: 18px;
    --app-radius-xl: 22px;
}

[data-theme="teal"] {
    --app-primary: #0f766e;
    --app-primary-dark: #115e59;
    --app-primary-soft: #e6fffb;
    --app-primary-soft-2: #f0fdfa;
    --app-primary-border: #99f6e4;
    --app-primary-border-soft: #ccfbf1;
    --app-primary-rgb: 15, 118, 110;
}

[data-theme="blue"] {
    --app-primary: #2563eb;
    --app-primary-dark: #1d4ed8;
    --app-primary-soft: #eff6ff;
    --app-primary-soft-2: #f3f8ff;
    --app-primary-border: #bfdbfe;
    --app-primary-border-soft: #dbeafe;
    --app-primary-rgb: 37, 99, 235;
}

[data-theme="green"] {
    --app-primary: #16a34a;
    --app-primary-dark: #15803d;
    --app-primary-soft: #ecfdf3;
    --app-primary-soft-2: #f0fdf4;
    --app-primary-border: #bbf7d0;
    --app-primary-border-soft: #dcfce7;
    --app-primary-rgb: 22, 163, 74;
}

[data-theme="purple"] {
    --app-primary: #7c3aed;
    --app-primary-dark: #6d28d9;
    --app-primary-soft: #f5f3ff;
    --app-primary-soft-2: #faf5ff;
    --app-primary-border: #ddd6fe;
    --app-primary-border-soft: #ede9fe;
    --app-primary-rgb: 124, 58, 237;
}

[data-theme="red"] {
    --app-primary: #dc2626;
    --app-primary-dark: #b91c1c;
    --app-primary-soft: #fff1f2;
    --app-primary-soft-2: #fff5f5;
    --app-primary-border: #fecaca;
    --app-primary-border-soft: #fee2e2;
    --app-primary-rgb: 220, 38, 38;
}

[data-theme="slate"] {
    --app-primary: #334155;
    --app-primary-dark: #1e293b;
    --app-primary-soft: #f1f5f9;
    --app-primary-soft-2: #f8fafc;
    --app-primary-border: #cbd5e1;
    --app-primary-border-soft: #e2e8f0;
    --app-primary-rgb: 51, 65, 85;
}

/* Notifications */
.tp-notification-wrap{position:relative;display:inline-flex;align-items:center}.tp-notification-btn{position:relative;width:40px;height:40px;border:1px solid var(--app-border,#e5e7eb);border-radius:14px;background:var(--app-surface,#fff);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.tp-notification-btn svg{width:19px;height:19px;fill:none;stroke:var(--app-primary,#f97316);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tp-notification-badge{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--app-primary,#f97316);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}.tp-notification-panel{position:absolute;right:0;top:48px;width:min(380px,calc(100vw - 28px));max-height:520px;overflow:auto;background:var(--app-surface,#fff);border:1px solid var(--app-border,#e5e7eb);border-radius:18px;box-shadow:0 24px 60px rgba(15,23,42,.16);z-index:2000;padding:10px}.tp-notification-head{display:flex;align-items:center;justify-content:space-between;padding:8px 8px 12px}.tp-notification-head button,.tp-notification-item button{border:0;background:transparent;color:var(--app-primary,#f97316);font-weight:700;cursor:pointer}.tp-notification-item{padding:12px;border-radius:14px;border:1px solid var(--app-border,#e5e7eb);margin-bottom:8px;background:rgba(249,250,251,.82)}.tp-notification-item b{display:block;font-size:14px}.tp-notification-item p{margin:4px 0;color:var(--app-muted,#64748b);font-size:13px}.tp-notification-item small{display:block;color:var(--app-muted,#64748b);font-size:11px;margin-bottom:4px}.tp-notification-empty{padding:24px;text-align:center;color:var(--app-muted,#64748b)}

/* Telegram notification connect */
.tp-telegram-connect-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--app-primary) 18%, #e5e7eb);
    border-radius: 16px;
    background: color-mix(in srgb, var(--app-primary) 4%, #fff);
    margin-bottom: 1rem;
}

.tp-connect-title {
    font-weight: 700;
    color: #111827;
}

.tp-connect-subtitle,
.tp-connect-note {
    font-size: .86rem;
    color: #6b7280;
    margin-top: .15rem;
}

.tp-info-alert {
    border: 1px solid #dbeafe;
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 14px;
    padding: .8rem .95rem;
    margin-bottom: 1rem;
    font-size: .9rem;
}

.tp-code-link {
    margin-top: .35rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    word-break: break-all;
    color: #111827;
}

.tp-nowrap {
    flex-wrap: nowrap;
}

media (max-width: 720px) {
    .tp-telegram-connect-box {
        align-items: stretch;
        flex-direction: column;
    }

    .tp-nowrap {
        flex-wrap: wrap;
    }
}

/* Notification settings - event type selector */
.tp-mt { margin-top: 18px; }
.tp-notification-types { display: grid; gap: 14px; }
.tp-notification-type-group { border: 1px solid rgba(15, 23, 42, .08); border-radius: 16px; padding: 14px; background: rgba(248, 250, 252, .72); }
.tp-notification-type-group-title { font-weight: 700; color: var(--app-primary, #ff6a00); margin-bottom: 10px; }
.tp-notification-type-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px 16px; }
.tp-notification-type-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 12px; background: #fff; border: 1px solid rgba(15, 23, 42, .06); }
.tp-notification-type-item small { color: #64748b; font-size: 12px; }
.tp-info-alert-soft { background: rgba(255, 106, 0, .07); border-color: rgba(255, 106, 0, .22); color: #7c2d12; }

/* Custom notification sender */
.tp-custom-notification-page .tp-custom-notification-grid { align-items: start; }
.tp-field-full { grid-column: 1 / -1; }
.tp-custom-notification-page .dxbl-memo textarea,
.tp-custom-notification-page textarea { min-height: 120px; }
@media (max-width: 760px) {
    .tp-custom-notification-page .tp-toolbar-actions { flex-wrap: wrap; }
    .tp-custom-notification-page .tp-toolbar-actions .dxbl-btn { width: 100%; }
}
