/* ==========================================================================
   Atelier PMS — Glassmorphism theme
   Loaded after style.css; enabled/disabled by the theme switcher.
   ========================================================================== */

body {
  background:
    radial-gradient(ellipse 55% 42% at 12% 8%, rgba(171, 130, 72, 0.38), transparent 62%),
    radial-gradient(ellipse 50% 45% at 88% 18%, rgba(124, 148, 108, 0.42), transparent 65%),
    radial-gradient(ellipse 60% 52% at 72% 92%, rgba(163, 108, 90, 0.34), transparent 62%),
    radial-gradient(ellipse 46% 40% at 22% 82%, rgba(79, 106, 128, 0.34), transparent 65%),
    linear-gradient(160deg, #f2ecdf, #e6decd);
  background-attachment: fixed;
}

/* ---- Frosted panels ------------------------------------------------------ */

.card, .stat-card, .task-row, .file-card, .folder-row, .content .site-card {
  background: rgba(255, 255, 255, 0.48);
  border: 1px solid rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(18px) saturate(1.5);
  -webkit-backdrop-filter: blur(18px) saturate(1.5);
  box-shadow: 0 8px 32px rgba(28, 26, 23, 0.08);
}

.topbar {
  background: rgba(255, 255, 255, 0.4);
  border-bottom: 1px solid rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(20px) saturate(1.5);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
}

.dropdown-panel, .modal {
  background: rgba(255, 255, 255, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(26px) saturate(1.6);
  -webkit-backdrop-filter: blur(26px) saturate(1.6);
}
.modal-overlay { backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); background: rgba(28, 26, 23, 0.35); }
.dropdown-head, .notif-item { border-color: rgba(255, 255, 255, 0.6); }

.sidebar {
  background: rgba(24, 22, 18, 0.78);
  backdrop-filter: blur(22px) saturate(1.4);
  -webkit-backdrop-filter: blur(22px) saturate(1.4);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
}

/* ---- Controls ------------------------------------------------------------ */

.topbar-search, .icon-btn, .btn-secondary,
.field input, .field select, .field textarea {
  background: rgba(255, 255, 255, 0.52);
  border-color: rgba(255, 255, 255, 0.75);
}
.btn-secondary:hover, .icon-btn:hover { border-color: var(--brass); background: rgba(255, 255, 255, 0.7); }

.role-tabs { background: rgba(255, 255, 255, 0.4); border-color: rgba(255, 255, 255, 0.7); }

.dropzone {
  background: rgba(255, 255, 255, 0.3);
  border-color: rgba(171, 130, 72, 0.45);
}
.dropzone.drag { background: rgba(255, 255, 255, 0.55); }

/* ---- Detail surfaces ------------------------------------------------------ */

th { border-bottom-color: rgba(255, 255, 255, 0.65); }
td { border-bottom-color: rgba(255, 255, 255, 0.45); }
tbody tr:hover { background: rgba(255, 255, 255, 0.35); }

.tabs { border-bottom-color: rgba(255, 255, 255, 0.65); }
.divider { background: rgba(255, 255, 255, 0.65); }

.progress-track { background: rgba(255, 255, 255, 0.55); }
.ring { background: conic-gradient(var(--brass) calc(var(--pct) * 1%), rgba(255, 255, 255, 0.55) 0); }
.ring::before {
  background: rgba(255, 255, 255, 0.62);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.step-dot { background: rgba(255, 255, 255, 0.55); border-color: rgba(255, 255, 255, 0.85); }
.step.done .step-dot { background: var(--brass); border-color: var(--brass); }
.step-line { background: rgba(255, 255, 255, 0.7); }
.step.done .step-line { background: var(--brass); }

.timeline::before { background: rgba(255, 255, 255, 0.75); }
.timeline-dot { background: rgba(255, 255, 255, 0.7); border-color: rgba(255, 255, 255, 0.95); }
.timeline-item.done .timeline-dot { background: var(--brass); border-color: var(--brass); }

.task-check { background: rgba(255, 255, 255, 0.55); }
.task-row.complete .task-check { background: var(--brass); }

.badge-ontrack { background: rgba(85, 116, 79, 0.16); }
.badge-risk { background: rgba(184, 133, 58, 0.16); }
.badge-delayed { background: rgba(164, 79, 66, 0.16); }
.badge-complete { background: rgba(171, 130, 72, 0.18); }
.badge-pending { background: rgba(147, 137, 122, 0.18); }
.badge-review { background: rgba(79, 106, 128, 0.16); }

/* ---- Auth page ------------------------------------------------------------ */

.auth-form-side { background: transparent; }
.auth-box {
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: var(--radius-lg);
  padding: 44px 40px;
  backdrop-filter: blur(22px) saturate(1.5);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  box-shadow: 0 20px 48px rgba(28, 26, 23, 0.12);
  max-width: 430px;
}
.auth-visual { background: radial-gradient(circle at 20% 20%, rgba(58, 52, 40, 0.92), rgba(28, 26, 23, 0.94) 70%); }