/* ==========================================================
   OBS DESIGN SYSTEM
   LIGHT THEME
   ========================================================== */
:root {
	/* ======================================================
       COLOR SCHEME
       ====================================================== */
	--obs-color-scheme: light;
	/* ======================================================
       BRAND COLORS
       ====================================================== */
	--obs-primary: #0284c7;
	--obs-primary-hover: #0369a1;
	--obs-primary-active: #075985;
	--obs-success: #16a34a;
	--obs-success-hover: #15803d;
	--obs-warning: #d97706;
	--obs-danger: #e11d48;
	--obs-danger-hover: #be123c;
	--obs-info: #0284c7;
	/* ======================================================
       BACKGROUND
       ====================================================== */
	--obs-bg-page: #eef4f8;
	--obs-bg-page-secondary: #dbeaf2;
	--obs-bg-page-tertiary: #c9dfe9;
	/* ======================================================
       SURFACE
       ====================================================== */
	--obs-surface-1: rgba(255, 255, 255, 0.92);
	--obs-surface-2: rgba(255, 255, 255, 0.72);
	--obs-surface-3: rgba(255, 255, 255, 0.55);
	--obs-surface-hover: rgba(2, 132, 199, 0.08);
	/* ======================================================
       TEXT
       ====================================================== */
	--obs-text-primary: rgba(15, 23, 42, 0.94);
	--obs-text-secondary: rgba(15, 23, 42, 0.72);
	--obs-text-muted: rgba(15, 23, 42, 0.60);
	--obs-text-disabled: rgba(15, 23, 42, 0.42);
	--obs-text-on-primary: #ffffff;
	/* ======================================================
       INPUT
       ====================================================== */
	--obs-input-bg: rgba(255, 255, 255, 0.72);
	--obs-input-bg-focus: rgba(255, 255, 255, 0.96);
	--obs-input-bg-disabled: rgba(226, 232, 240, 0.72);
	--obs-input-text: var(--obs-text-primary);
	--obs-input-placeholder: rgba(15, 23, 42, 0.48);
	--obs-input-icon: rgba(15, 23, 42, 0.65);
	/* ======================================================
       BORDER
       ====================================================== */
	--obs-border-primary: rgba(15, 23, 42, 0.16);
	--obs-border-secondary: rgba(15, 23, 42, 0.10);
	--obs-border-hover: rgba(2, 132, 199, 0.42);
	/* ======================================================
       BUTTON
       ====================================================== */
	--obs-button-primary-text: #ffffff;
	--obs-button-success-text: #ffffff;
	--obs-button-danger-text: #ffffff;
	--obs-button-spinner-track: rgba(255, 255, 255, 0.38);
	--obs-button-spinner-color: rgba(255, 255, 255, 0.96);
	/* ======================================================
       STATUS SURFACES
       ====================================================== */
	--obs-success-surface: rgba(22, 163, 74, 0.08);
	--obs-success-border: rgba(22, 163, 74, 0.28);
	--obs-danger-surface: rgba(225, 29, 72, 0.08);
	--obs-danger-border: rgba(225, 29, 72, 0.28);
	/* ======================================================
       SHADOW
       ====================================================== */
	--obs-shadow-sm: 0 4px 12px rgba(15, 23, 42, 0.12);
	--obs-shadow-md: 0 14px 34px rgba(15, 23, 42, 0.16);
	--obs-shadow-lg: 0 22px 70px rgba(15, 23, 42, 0.22);
	--obs-shadow-inset-soft: inset 0 1px 0 rgba(255, 255, 255, 0.65);
	--obs-shadow-inset-strong: inset 0 1px 0 rgba(255, 255, 255, 0.82);
	/* ======================================================
       FOCUS
       ====================================================== */
	--obs-focus-ring: 0 0 0 5px rgba(2, 132, 199, 0.18);
	--obs-danger-focus-ring: 0 0 0 5px rgba(225, 29, 72, 0.16);
	--obs-success-focus-ring: 0 0 0 5px rgba(22, 163, 74, 0.16);
	/* ======================================================
       GLASS / EFFECT
       ====================================================== */
	--obs-glass-surface: linear-gradient(180deg, rgba(255, 255, 255, 0.88),
		rgba(255, 255, 255, 0.68));
	--obs-brand-gradient: linear-gradient(135deg, rgba(2, 132, 199, 0.96),
		rgba(22, 163, 74, 0.94));
	--obs-page-background: radial-gradient(1200px 650px at 18% 10%, rgba(14, 165, 233, 0.18),
		transparent 60%),
		radial-gradient(900px 600px at 85% 18%, rgba(34, 197, 94, 0.12),
		transparent 60%),
		radial-gradient(700px 450px at 50% 95%, rgba(244, 63, 94, 0.07),
		transparent 60%), linear-gradient(160deg, var(--obs-bg-page),
		var(--obs-bg-page-secondary));
	--obs-page-glow: radial-gradient(520px 420px at 20% 20%, rgba(14, 165, 233, 0.15),
		transparent 60%),
		radial-gradient(520px 420px at 80% 30%, rgba(34, 197, 94, 0.10),
		transparent 60%),
		radial-gradient(520px 420px at 50% 85%, rgba(244, 63, 94, 0.06),
		transparent 60%);
	--obs-panel-glow: radial-gradient(650px 350px at 10% 10%, rgba(14, 165, 233, 0.13),
		transparent 55%),
		radial-gradient(650px 350px at 90% 20%, rgba(34, 197, 94, 0.10),
		transparent 55%);
	/* ======================================================
       APPLICATION SHELL
       ====================================================== */
	--obs-shell-bg: linear-gradient(180deg, #eef4f8, #dbeaf2);
	--obs-content-bg: linear-gradient(180deg, #f8fbfd, #edf4f8);
	--obs-content-surface: linear-gradient(180deg, rgba(255, 255, 255, .96),
		rgba(255, 255, 255, .90));
	--obs-content-inner-border: inset 0 0 0 1px rgba(15, 23, 42, .06);
	--obs-content-shadow: 0 12px 32px rgba(15, 23, 42, .10);
	--obs-content-top-highlight: inset 0 1px 0 rgba(255, 255, 255, .75);
	/* ======================================================
       BUSY OVERLAY
       ====================================================== */
	--obs-busy-overlay: rgba(15, 23, 42, 0.22);
	--obs-busy-spinner-track: rgba(15, 23, 42, 0.22);
	/* ======================================================
       DIVIDER / PROGRESS
       ====================================================== */
	--obs-divider-color: rgba(15, 23, 42, 0.14);
	--obs-progress-track: rgba(15, 23, 42, 0.10);
	/* ======================================================
       POPUP / DROPDOWN
       ====================================================== */
	--obs-popup-bg: rgba(255, 255, 255, 0.97);
	--obs-popup-border: rgba(15, 23, 42, 0.16);
	--obs-popup-shadow: 0 22px 60px rgba(15, 23, 42, 0.20);
	/* ======================================================
       THEME PREVIEWS
       ====================================================== */
	--obs-theme-preview-dark-1: #070b14;
	--obs-theme-preview-dark-2: #38bdf8;
	--obs-theme-preview-light-1: #ffffff;
	--obs-theme-preview-light-2: #0284c7;
	--obs-theme-preview-blue-1: #04121f;
	--obs-theme-preview-blue-2: #38bdf8;
	--obs-theme-preview-green-1: #03140f;
	--obs-theme-preview-green-2: #34d399;
	--obs-theme-preview-purple-1: #130a24;
	--obs-theme-preview-purple-2: #a78bfa;
	--obs-theme-preview-amber-1: #1c1204;
	--obs-theme-preview-amber-2: #f59e0b;
	--obs-theme-preview-slate-1: #0f172a;
	--obs-theme-preview-slate-2: #94a3b8;
	--obs-theme-preview-orange-1: #431407;
	--obs-theme-preview-orange-2: #f97316;
	--obs-theme-preview-galatasaray-1: #7f1d1d;
	--obs-theme-preview-galatasaray-2: #facc15;
	--obs-theme-preview-teal-1: #042f2e;
	--obs-theme-preview-teal-2: #2dd4bf;
	--obs-theme-preview-desktop-1: #0d3f4b; --obs-theme-preview-desktop-2 :
	#2d7f94;
	/* ======================================================
       CONTROL / FORM
       ====================================================== */
	--obs-control-text: #172033;
	--obs-control-placeholder: #7a8598;
	--obs-control-bg: #ffffff;
	--obs-control-bg-focus: #ffffff;
	--obs-control-border: #cfd7e3;
	--obs-control-border-hover: #7cb7d8;
	--obs-control-border-focus: #2698d4;
	--obs-control-focus-ring: 0 0 0 5px rgba(38, 152, 212, 0.16);
	--obs-control-disabled-text: #8a94a4;
	--obs-control-disabled-bg: #f1f4f8;
	--obs-control-disabled-border: #d9e0e9;
	/* ======================================================
       TABLE
       ====================================================== */
	--obs-table-bg: #ffffff;
	--obs-table-container-bg: #ffffff;
	--obs-table-container-border: #d8e0ea;
	--obs-table-container-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
	--obs-table-border: #e2e8f0;
	--obs-table-header-bg: linear-gradient(180deg, #eaf4fb, #dbeaf5);
	--obs-table-header-text: #17324a;
	--obs-table-cell-bg: #ffffff;
	--obs-table-cell-text: #334155;
	--obs-table-row-hover-bg: #e8f5fc;
	--obs-table-row-hover-text: #132f46;
	--obs-table-footer-bg: linear-gradient(180deg, #eaf4fb, #dbeaf5);
	--obs-table-footer-text: #475569;
	/* ======================================================
       SCROLLBAR
       ====================================================== */
	--obs-scrollbar-track: #eef2f6;
	--obs-scrollbar-thumb: #8ec5df;
	--obs-scrollbar-thumb-hover: #58a9cf;
	/* ======================================================
       MESSAGE PANELS
       ====================================================== */
	--obs-error-panel-text: #8a1c32;
	--obs-error-panel-bg: #fff0f3;
	--obs-error-panel-border: #f2a7b6;
	--obs-success-panel-text: #166534;
	--obs-success-panel-bg: #f0fdf4;
	--obs-success-panel-border: #86efac;
	--obs-warning-panel-text: #92400e;
	--obs-warning-panel-bg: #fffbeb;
	--obs-warning-panel-border: #fcd34d;
	--obs-info-panel-text: #1d4ed8;
	--obs-info-panel-bg: #eff6ff;
	--obs-info-panel-border: #93c5fd;
	/* ======================================================
       LABEL / TYPOGRAPHY
       ====================================================== */
	--obs-label-text: var(--obs-text-secondary);
	--obs-label-box-text: var(--obs-text-primary);
	--obs-label-box-bg: var(--obs-surface-2);
	--obs-label-box-border: var(--obs-border-primary);
	--obs-title-text: var(--obs-text-primary);
	--obs-subtitle-text: var(--obs-text-secondary);
	--obs-helper-text: var(--obs-text-muted);
	--obs-required-text: var(--obs-danger);
	--obs-muted-text: var(--obs-text-muted);
	/* ======================================================
       TABLE STATE
       ====================================================== */
	--obs-table-row-selected-bg: rgba(14, 165, 233, .15);
	--obs-table-row-active-bg: rgba(14, 165, 233, .10);
	/* ======================================================
       BADGE
       ====================================================== */
	--obs-badge-text: #ffffff;
	--obs-badge-primary-bg: #0284c7;
	--obs-badge-primary-shadow: 0 0 0 2px rgba(2, 132, 199, .18);
	/* ======================================================
       TABLE FOOTER
       ====================================================== */
	--obs-table-footer-border: rgba(37, 99, 235, 0.28);
	--obs-table-footer-padding-y: 8px;
	--obs-table-footer-padding-x: 10px;
	/* MODAL CLOSE BUTTON*/
	--obs-modal-close-filter: none;
	--obs-theme-preview-desktop-2: #2d7f94;
}