/* ================================================================
   GLASS BOOTSTRAP SKIN – SAFE LAYOUT, THEME-BASED, AUTO LIGHT/DARK
================================================================ */

/* ================================================================
   GLOBAL GLASS OPACITY (ONE KNOB TO CONTROL WHOLE UI)
================================================================ */
:root {

    --glass-opacity: 0.90; /* ← ZMIENIASZ TYLKO TO! (0.0–1.0) */
    --glass-card-opacity: 1; 
}

/* ================================================================
   GLASS COLOR VARIABLES (neutral glass base)
================================================================ */
:root {

    --glass-bg: rgba(255,255,255,var(--glass-opacity));
    --glass-bg-strong: rgba(255,255,255,calc(var(--glass-opacity) + 0.05));
    --glass-border: rgba(0,0,0,0.12);
    
    --glass-card-bg: rgba(255,255,255,var(--glass-card-opacity));
    --glass-card-bg-strong: rgba(255,255,255,calc(var(--glass-card-opacity) + 0.05));
    
}

* {
	color: var(--bs-body-color);
}
/* ================================================================
   UNIVERSAL TEXT COLOR
================================================================ */
body {
    color: var(--bs-body-color);
}

/* ================================================================
   STANDARD BOOTSTRAP COMPONENTS WITH GLASS SKIN
================================================================ */

/* ---------------- NAVBAR ---------------- */
.navbar {
    background: var(--glass-bg-strong) !important;
    border-bottom: 1px solid var(--glass-border);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    box-shadow: 0 12px 24px rgba(0,0,0,.15);
}

.navbar .nav-link,
.navbar .navbar-brand {
    color: var(--bs-body-color) !important;
}

.navbar .nav-link:hover {
    color: var(--bs-primary) !important;
}

/* ---------------- CARD ---------------- */
.card {
    background: var(--glass-card-bg) !important;
    border-color: var(--glass-border) !important;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    box-shadow: 0 14px 32px rgba(0,0,0,.16);
    border-radius: var(--bs-border-radius) !important;
    color: var(--bs-body-color);
}

.card-header {
    background: var(--glass-card-bg-strong) !important;
    border-color: var(--glass-border) !important;
    color: var(--bs-body-color);
}

/* ---------------- BUTTONS ---------------- */
.btn {
    background: var(--glass-bg);
    border-color: var(--glass-border);
    color: var(--bs-body-color);
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    border-radius: var(--bs-border-radius);
}

.btn:hover,
.btn:focus {
    background: rgba(var(--bs-primary-rgb), 0.85) !important;
    border-color: var(--bs-primary) !important;
    color: #fff !important;
}

/* Outline buttons */
.btn-outline-primary {
    background: var(--glass-bg);
    border-color: var(--bs-primary);
    color: var(--bs-primary);
}
.btn-outline-primary:hover {
    background: rgba(var(--bs-primary-rgb), 0.15) !important;
    border-color: var(--bs-primary) !important;
    color: var(--bs-primary);
}

/* ---------------- FORMS ---------------- */
.form-control,
.form-select,
.input-group-text {
    background: var(--glass-bg) !important;
    border-color: var(--glass-border) !important;
    color: var(--bs-body-color) !important;
    backdrop-filter: blur(16px) saturate(160%);
    -webkit-backdrop-filter: blur(16px) saturate(160%);
    border-radius: var(--bs-border-radius);
}

.form-control::placeholder {
    color: var(--bs-secondary-color);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--bs-primary) !important;
    box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .30) !important;
}

/* ---------------- MODALS ---------------- */
.modal-content {
    background: var(--glass-bg-strong) !important;
    border-color: var(--glass-border);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    border-radius: var(--bs-border-radius);
    color: var(--bs-body-color);
}

/* ---------------- DROPDOWNS ---------------- */
.dropdown-menu {
    background: var(--glass-bg-strong) !important;
    border-color: var(--glass-border);
    backdrop-filter: blur(18px) saturate(160%);
    border-radius: var(--bs-border-radius);
}

.dropdown-item {
    color: var(--bs-body-color) !important;
}
.dropdown-item:hover {
    background: rgba(var(--bs-primary-rgb), .15) !important;
    color: var(--bs-primary) !important;
}

/* ---------------- LIST GROUP ---------------- */
.list-group-item {
    background: var(--glass-bg) !important;
    border-color: var(--glass-border);
    color: var(--bs-body-color);
}
.list-group-item.active,
.list-group-item:hover {
    background: rgba(var(--bs-primary-rgb), .35) !important;
}

/* ---------------- TABLE ---------------- */
.table {
    background: var(--glass-bg-strong) !important;
    color: var(--bs-body-color);
    border-color: var(--glass-border);
    backdrop-filter: blur(14px);
}
.table thead {
    background: var(--glass-bg);
}

/* ---------------- OFFCANVAS ---------------- */
.offcanvas {
    background: var(--glass-bg-strong) !important;
    border-color: var(--glass-border);
    backdrop-filter: blur(22px);
}

/* ---------------- TOAST ---------------- */
.toast,
.toast-header {
    background: var(--glass-bg-strong) !important;
    border-color: var(--glass-border);
    backdrop-filter: blur(18px);
    border-radius: var(--bs-border-radius);
    color: var(--bs-body-color);
}

/* ---------------- BADGES ---------------- */
.badge {
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border);
    color: var(--bs-body-color);
    backdrop-filter: blur(12px);
    border-radius: var(--bs-border-radius);
}

/* ---------------- POPOVER / TOOLTIP ---------------- */
.popover,
.tooltip-inner {
    background: var(--glass-bg-strong);
    border-color: var(--glass-border);
    color: var(--bs-body-color);
    backdrop-filter: blur(14px);
    border-radius: var(--bs-border-radius);
}

/* ---------------- PAGINATION ---------------- */
.page-link {
    background: var(--glass-bg);
    border-color: var(--glass-border);
    color: var(--bs-body-color);
}
.page-link:hover {
    background: rgba(var(--bs-primary-rgb), .25);
}

/* ---------------- ALERT ---------------- */
.alert {
    background: var(--glass-bg-strong) !important;
    border-color: var(--glass-border) !important;
    color: var(--bs-body-color) !important;
    backdrop-filter: blur(14px);
}

/* ================================================================
   BOOTSTRAP BORDER RADIUS RESTORE
================================================================ */
.card,
.btn,
.form-control,
.form-select,
.input-group-text,
.toast,
.modal-content,
.dropdown-menu,
.list-group-item,
.table,
.popover,
.tooltip-inner,
.offcanvas,
.alert,
.page-link,
.badge {
    border-radius: var(--bs-border-radius) !important;
}

.btn-sm,
.form-control-sm,
.form-select-sm {
    border-radius: var(--bs-border-radius-sm) !important;
}

.btn-lg,
.form-control-lg,
.form-select-lg {
    border-radius: var(--bs-border-radius-lg) !important;
}

.rounded-pill { border-radius: var(--bs-border-radius-pill) !important; }

* {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
