﻿/*
 * South Baridhara Society - shared UI base (admin panel and public site)
 * Palette is taken from the society logo: deep green, signal red and black.
 * Components are scoped to body.sbs-ui and themed through html[data-theme].
 */

/* ------------------------------------------------------------------ tokens */
:root {
  --au-green: #0f7b3f;
  --au-green-600: #0b6633;
  --au-green-400: #2fa866;
  --au-green-soft: #e3f4ea;
  --au-red: #e0242b;
  --au-red-600: #bf1a21;
  --au-red-soft: #fde8e9;
  --au-ink: #121614;
  --au-ink-soft: #e9ecea;
  --au-amber: #c98a06;
  --au-amber-soft: #fbf1d9;

  --au-bg: #f2f6f3;
  --au-surface: #ffffff;
  --au-surface-2: #f6f9f7;
  --au-text: #151a17;
  --au-muted: #5a6760;
  --au-border: #e1e9e4;
  --au-shadow: 0 1px 2px rgba(18, 22, 20, 0.04), 0 8px 24px rgba(15, 123, 63, 0.07);
  --au-shadow-lift: 0 2px 4px rgba(18, 22, 20, 0.05), 0 16px 36px rgba(15, 123, 63, 0.14);
  --au-glow-a: rgba(15, 123, 63, 0.1);
  --au-glow-b: rgba(224, 36, 43, 0.07);

  --au-r-sm: 12px;
  --au-r-md: 16px;
  --au-r-lg: 24px;
  --au-pill: 999px;

  --headings-color: var(--au-text);
  --body-text-color: var(--au-muted);
  --title-font-family: "Plus Jakarta Sans", "DM Sans", "Noto Sans Bengali", sans-serif;
  --body-font-family: "Plus Jakarta Sans", "DM Sans", "Noto Sans Bengali", sans-serif;
  color-scheme: light;
}

html[data-theme="dark"] {
  --au-green: #34c176;
  --au-green-600: #27a762;
  --au-green-400: #5fd897;
  --au-green-soft: rgba(52, 193, 118, 0.14);
  --au-red: #ff5d63;
  --au-red-600: #ff7b80;
  --au-red-soft: rgba(255, 93, 99, 0.15);
  --au-ink: #f1f5f2;
  --au-ink-soft: rgba(241, 245, 242, 0.1);
  --au-amber: #f0b83a;
  --au-amber-soft: rgba(240, 184, 58, 0.15);

  --au-bg: #090d0b;
  --au-surface: #121916;
  --au-surface-2: #18211d;
  --au-text: #e9f0ec;
  --au-muted: #a0aea6;
  --au-border: #25312b;
  --au-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 28px rgba(0, 0, 0, 0.35);
  --au-shadow-lift: 0 2px 4px rgba(0, 0, 0, 0.5), 0 18px 40px rgba(0, 0, 0, 0.5);
  --au-glow-a: rgba(52, 193, 118, 0.12);
  --au-glow-b: rgba(255, 93, 99, 0.08);
  color-scheme: dark;
}

/* -------------------------------------------------------------- foundation */
body.sbs-ui {
  background-color: var(--au-bg);
  background-image:
    radial-gradient(900px 480px at 100% -5%, var(--au-glow-b), transparent 60%),
    radial-gradient(1000px 560px at -5% 0%, var(--au-glow-a), transparent 60%);
  background-attachment: fixed;
  color: var(--au-text);
  font-family: var(--body-font-family);
  transition: background-color 0.25s ease, color 0.25s ease;
}

body.sbs-ui h1,
body.sbs-ui h2,
body.sbs-ui h3,
body.sbs-ui h4,
body.sbs-ui h5,
body.sbs-ui h6,
body.sbs-ui .title,
body.sbs-ui .list-title {
  color: var(--au-text);
  font-family: var(--title-font-family);
}

body.sbs-ui p,
body.sbs-ui label,
body.sbs-ui .form-label {
  color: var(--au-muted);
}

body.sbs-ui label,
body.sbs-ui .form-label {
  font-weight: 600;
  font-size: 0.86rem;
}

body.sbs-ui a {
  transition: color 0.15s ease, background-color 0.15s ease;
}

body.sbs-ui .wrapper,
body.sbs-ui .dashboard_content_wrapper {
  background: transparent;
}

body.sbs-ui .preloader {
  background-color: var(--au-bg);
}

body.sbs-ui :focus-visible {
  outline: 3px solid color-mix(in srgb, var(--au-green) 55%, transparent);
  outline-offset: 2px;
}

body.sbs-ui hr {
  background-color: var(--au-border);
  border-color: var(--au-border);
  opacity: 1;
}

body.sbs-ui .text-muted,
body.sbs-ui .text-secondary {
  color: var(--au-muted) !important;
}

body.sbs-ui .text-thm,
body.sbs-ui .text-thm6,
body.sbs-ui .text-success {
  color: var(--au-green) !important;
}

body.sbs-ui .text-danger {
  color: var(--au-red) !important;
}

body.sbs-ui .text-info {
  color: var(--au-amber) !important;
}

body.sbs-ui .text-dark,
body.sbs-ui .text-black {
  color: var(--au-text) !important;
}

/* utility classes from the base theme that hard-code light colours */
body.sbs-ui .bgc-white,
body.sbs-ui .bgc-f7,
body.sbs-ui .bg-white,
body.sbs-ui .bg-light {
  background-color: var(--au-surface) !important;
}

body.sbs-ui .bdrb1,
body.sbs-ui .bdr1,
body.sbs-ui .bdrt1 {
  border-color: var(--au-border) !important;
}

body.sbs-ui .bdrs4 {
  border-radius: var(--au-r-lg);
}

body.sbs-ui ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

body.sbs-ui ::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--au-green) 35%, var(--au-border));
  border-radius: var(--au-pill);
  border: 2px solid transparent;
  background-clip: content-box;
}

/* ----------------------------------------------------------------- dropdown */
body.sbs-ui .dropdown-menu,
body.sbs-ui .user_setting .dropdown-menu.show {
  background: var(--au-surface);
  border: 1px solid var(--au-border);
  border-radius: var(--au-r-md);
  box-shadow: var(--au-shadow-lift);
  padding: 10px;
}

body.sbs-ui .user_setting .dropdown-menu .dropdown-item,
body.sbs-ui .dropdown-item {
  border-radius: var(--au-r-sm);
  color: var(--au-text);
  font-size: 15px;
  padding: 11px 16px;
}

body.sbs-ui .user_setting .dropdown-menu .dropdown-item:hover,
body.sbs-ui .user_setting .dropdown-menu .dropdown-item.active,
body.sbs-ui .user_setting .dropdown-menu .dropdown-item:hover span,
body.sbs-ui .dropdown-item:hover,
body.sbs-ui .dropdown-item.active {
  background: var(--au-green);
  color: #ffffff;
}

body.sbs-ui .user_setting .dropdown-menu .dropdown-item i {
  color: var(--au-green);
}

body.sbs-ui .user_setting .dropdown-menu .dropdown-item:hover i {
  color: #ffffff;
}

body.sbs-ui .user_setting .dropdown-menu p {
  margin-bottom: 4px;
}

/* ------------------------------------------------------------ theme switch */
.au-theme-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 64px;
  height: 34px;
  padding: 0;
  margin-right: 14px;
  border-radius: var(--au-pill);
  border: 1px solid var(--au-border);
  background: var(--au-surface-2);
  cursor: pointer;
  color: var(--au-muted);
  flex-shrink: 0;
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.au-theme-switch svg {
  position: absolute;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  z-index: 1;
  transition: color 0.25s ease;
}

.au-theme-switch .au-sun {
  left: 9px;
  color: #ffffff;
}

.au-theme-switch .au-moon {
  right: 9px;
}

.au-theme-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--au-green-400), var(--au-green));
  box-shadow: 0 2px 8px rgba(15, 123, 63, 0.4);
  transition: transform 0.28s cubic-bezier(0.34, 1.4, 0.64, 1), background 0.25s ease;
}

html[data-theme="dark"] .au-theme-switch::after {
  transform: translateX(30px);
  background: linear-gradient(135deg, #ff7b80, var(--au-red));
  box-shadow: 0 2px 8px rgba(255, 93, 99, 0.45);
}

html[data-theme="dark"] .au-theme-switch .au-sun {
  color: var(--au-muted);
}

html[data-theme="dark"] .au-theme-switch .au-moon {
  color: #ffffff;
}

.au-theme-switch:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--au-green) 55%, transparent);
  outline-offset: 2px;
}

/* -------------------------------------------------------------------- forms */
body.sbs-ui .form-control,
body.sbs-ui .form-select,
body.sbs-ui select,
body.sbs-ui textarea,
body.sbs-ui .form-style1 .form-control,
body.sbs-ui .bootstrap-select > .dropdown-toggle,
body.sbs-ui .input-group-text {
  background-color: var(--au-surface-2);
  border: 1.5px solid var(--au-border);
  border-radius: var(--au-r-sm);
  color: var(--au-text);
  font-size: 0.93rem;
  min-height: 46px;
  height: auto;
  outline: 0;
  padding-left: 16px;
  padding-right: 16px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

body.sbs-ui textarea.form-control {
  border-radius: var(--au-r-md);
}

body.sbs-ui .input-group > .form-control {
  border-radius: 0 var(--au-r-sm) var(--au-r-sm) 0;
}

body.sbs-ui .input-group > .input-group-text:first-child {
  border-radius: var(--au-r-sm) 0 0 var(--au-r-sm);
  color: var(--au-green);
  font-weight: 700;
}

body.sbs-ui .form-control::placeholder {
  color: color-mix(in srgb, var(--au-muted) 70%, transparent);
}

body.sbs-ui .form-control:focus,
body.sbs-ui .form-select:focus,
body.sbs-ui select:focus,
body.sbs-ui textarea:focus,
body.sbs-ui .form-style1 .form-control:focus {
  background-color: var(--au-surface);
  border-color: var(--au-green);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--au-green) 18%, transparent);
  color: var(--au-text);
  outline: 0;
}

body.sbs-ui .form-control:disabled,
body.sbs-ui .form-control[readonly] {
  opacity: 0.75;
}

body.sbs-ui .form-control.is-invalid,
body.sbs-ui .was-validated .form-control:invalid {
  border-color: var(--au-red);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--au-red) 16%, transparent);
}

body.sbs-ui .form-check-input {
  background-color: var(--au-surface-2);
  border: 1.5px solid var(--au-border);
}

body.sbs-ui .form-check-input:checked {
  background-color: var(--au-green);
  border-color: var(--au-green);
}

body.sbs-ui .bootstrap-select .dropdown-menu {
  border-radius: var(--au-r-md);
}

body.sbs-ui .invalid-feedback,
body.sbs-ui .text-red-600 {
  color: var(--au-red);
}

/* ------------------------------------------------------------------ buttons */
body.sbs-ui .ud-btn,
body.sbs-ui .btn {
  border-radius: var(--au-pill);
  font-weight: 700;
  letter-spacing: 0.005em;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, color 0.18s ease,
    border-color 0.18s ease;
}

body.sbs-ui .ud-btn::before {
  display: none;
}

body.sbs-ui .ud-btn:hover {
  transform: translateY(-2px);
}

body.sbs-ui .ud-btn:active {
  transform: translateY(0);
}

body.sbs-ui .btn-thm,
body.sbs-ui .btn-thm2,
body.sbs-ui .btn-home3,
body.sbs-ui .btn-primary {
  background: linear-gradient(135deg, var(--au-green-400), var(--au-green) 60%, var(--au-green-600));
  border: 0;
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(15, 123, 63, 0.28);
}

body.sbs-ui .btn-thm:hover,
body.sbs-ui .btn-thm2:hover,
body.sbs-ui .btn-home3:hover,
body.sbs-ui .btn-primary:hover {
  background: linear-gradient(135deg, var(--au-green), var(--au-green-600));
  border: 0;
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(15, 123, 63, 0.38);
}

body.sbs-ui .btn-dark {
  background: var(--au-ink);
  border: 1px solid var(--au-ink);
  color: var(--au-bg);
}

body.sbs-ui .btn-dark:hover {
  background: var(--au-red);
  border-color: var(--au-red);
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(224, 36, 43, 0.3);
}

html[data-theme="dark"] body.sbs-ui .btn-dark {
  background: #f1f5f2;
  border-color: #f1f5f2;
  color: #0b0f0d;
}

body.sbs-ui .btn-light-thm,
body.sbs-ui .btn-thm3 {
  background: var(--au-green-soft);
  border: 1px solid transparent;
  color: var(--au-green-600);
}

html[data-theme="dark"] body.sbs-ui .btn-light-thm,
html[data-theme="dark"] body.sbs-ui .btn-thm3 {
  color: var(--au-green-400);
}

body.sbs-ui .btn-light-thm:hover,
body.sbs-ui .btn-thm3:hover {
  background: var(--au-green);
  color: #ffffff;
}

body.sbs-ui .btn-thm-border,
body.sbs-ui .btn-dark-border,
body.sbs-ui .btn-white,
body.sbs-ui .btn-outline-secondary,
body.sbs-ui .btn-light {
  background: var(--au-surface);
  border: 1.5px solid var(--au-border);
  color: var(--au-text);
}

body.sbs-ui .btn-thm-border:hover,
body.sbs-ui .btn-dark-border:hover,
body.sbs-ui .btn-white:hover,
body.sbs-ui .btn-light:hover {
  background: var(--au-green-soft);
  border-color: var(--au-green);
  color: var(--au-green-600);
}

body.sbs-ui .btn-danger,
body.sbs-ui .btn-outline-danger:hover {
  background: var(--au-red);
  border-color: var(--au-red);
  color: #ffffff;
}

body.sbs-ui .btn-outline-danger {
  border-color: var(--au-red);
  color: var(--au-red);
}

/* -------------------------------------------------------- badges and alerts */
body.sbs-ui .badge,
body.sbs-ui .status,
body.sbs-ui [class*="badge-"] {
  border-radius: var(--au-pill);
  padding: 0.42em 0.85em;
  font-weight: 700;
  letter-spacing: 0.02em;
}

body.sbs-ui .badge.bg-success,
body.sbs-ui .bg-success {
  background-color: var(--au-green) !important;
  color: #ffffff;
}

body.sbs-ui .badge.bg-danger,
body.sbs-ui .bg-danger {
  background-color: var(--au-red) !important;
  color: #ffffff;
}

body.sbs-ui .badge.bg-warning,
body.sbs-ui .bg-warning {
  background-color: var(--au-amber) !important;
  color: #1b1403;
}

body.sbs-ui .badge.bg-dark,
body.sbs-ui .bg-dark,
body.sbs-ui .badge.bg-secondary {
  background-color: var(--au-ink) !important;
  color: var(--au-bg);
}

body.sbs-ui .alert {
  border-radius: var(--au-r-md);
  border: 1px solid var(--au-border);
  border-left-width: 5px;
  background: var(--au-surface);
  color: var(--au-text);
}

body.sbs-ui .alert-success {
  border-left-color: var(--au-green);
  background: var(--au-green-soft);
}

body.sbs-ui .alert-danger {
  border-left-color: var(--au-red);
  background: var(--au-red-soft);
}

body.sbs-ui .alert-warning,
body.sbs-ui .alert-info {
  border-left-color: var(--au-amber);
  background: var(--au-amber-soft);
}

/* ------------------------------------------------------- tabs, modals, misc */
body.sbs-ui .nav-tabs {
  border-color: var(--au-border);
}

body.sbs-ui .nav-tabs .nav-link,
body.sbs-ui .nav-pills .nav-link {
  border-radius: var(--au-pill);
  color: var(--au-muted);
  font-weight: 600;
}

body.sbs-ui .nav-tabs .nav-link.active,
body.sbs-ui .nav-pills .nav-link.active {
  background: var(--au-green);
  border-color: var(--au-green);
  color: #ffffff;
}

body.sbs-ui .modal-content {
  background: var(--au-surface);
  border: 1px solid var(--au-border);
  border-radius: var(--au-r-lg);
  color: var(--au-text);
}

body.sbs-ui .modal-header,
body.sbs-ui .modal-footer {
  border-color: var(--au-border);
}

html[data-theme="dark"] body.sbs-ui .btn-close {
  filter: invert(1);
}

body.sbs-ui .list-group-item {
  background: var(--au-surface);
  border-color: var(--au-border);
  color: var(--au-text);
}

body.sbs-ui .listing-style1 {
  background: var(--au-surface-2);
  border-color: var(--au-border);
  border-radius: var(--au-r-md);
  color: var(--au-text);
}

body.sbs-ui .listing-style1 .list-thumb {
  border-radius: 18px;
  background: var(--au-surface-2);
  border: 1px solid var(--au-border);
}

body.sbs-ui .listing-style1 .list-thumb img {
  border-radius: 14px;
}

body.sbs-ui .scrollToHome {
  background: var(--au-green);
  border-radius: 14px;
  color: #ffffff;
}

/* SweetAlert */
body.sbs-ui .swal2-popup {
  background: var(--au-surface);
  color: var(--au-text);
  border-radius: var(--au-r-lg);
  font-family: var(--body-font-family);
}

body.sbs-ui .swal2-title,
body.sbs-ui .swal2-html-container {
  color: var(--au-text);
}

body.sbs-ui .swal2-confirm,
body.sbs-ui .swal2-cancel,
body.sbs-ui .swal2-deny {
  border-radius: var(--au-pill) !important;
}

body.sbs-ui .swal2-confirm {
  background: var(--au-red) !important;
}

body.sbs-ui .swal2-cancel {
  background: var(--au-ink) !important;
  color: var(--au-bg) !important;
}

/* jQuery UI datepicker */
body.sbs-ui .ui-datepicker {
  background: var(--au-surface);
  border: 1px solid var(--au-border);
  border-radius: var(--au-r-md);
  color: var(--au-text);
}


/* dark theme: bright fills need dark text to stay readable */
html[data-theme="dark"] body.sbs-ui .btn-thm,
html[data-theme="dark"] body.sbs-ui .btn-thm2,
html[data-theme="dark"] body.sbs-ui .btn-home3,
html[data-theme="dark"] body.sbs-ui .btn-primary,
html[data-theme="dark"] body.sbs-ui .btn-thm:hover,
html[data-theme="dark"] body.sbs-ui .btn-thm2:hover,
html[data-theme="dark"] body.sbs-ui .btn-primary:hover,
html[data-theme="dark"] body.sbs-ui .btn-light-thm:hover,
html[data-theme="dark"] body.sbs-ui .btn-thm3:hover,
html[data-theme="dark"] body.sbs-ui .dropdown-item:hover,
html[data-theme="dark"] body.sbs-ui .dropdown-item.active,
html[data-theme="dark"] body.sbs-ui .nav-tabs .nav-link.active,
html[data-theme="dark"] body.sbs-ui .nav-pills .nav-link.active {
  color: #04150b;
}

html[data-theme="dark"] body.sbs-ui .btn-danger,
html[data-theme="dark"] body.sbs-ui .badge.bg-danger,
html[data-theme="dark"] body.sbs-ui .badge.bg-success {
  color: #04150b;
}
