/* Cleaned HUD CSS (duplicates removed, selectors fixed) */

/* Extracted HUD CSS from Blade files */

/* ===== resources\views\admin\auto_registration\index.blade.php :: <style> ===== */
:root {
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
        }

        .auto-admin-page {
            padding: 2rem 0 3rem;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .auto-hero {
            padding: 1.5rem;
            margin-bottom: 1rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .42rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .76rem;
            font-weight: 800;
            letter-spacing: .07em;
            text-transform: uppercase;
        }

        .auto-title {
            color: var(--hud-text);
            font-size: clamp(1.45rem, 3vw, 2.15rem);
            font-weight: 850;
            margin: .85rem 0 .35rem;
        }

        .auto-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .auto-subtitle code {
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .16);
            border-radius: .5rem;
            padding: .1rem .35rem;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .auto-filter {
            padding: 1.25rem;
            margin-bottom: 1rem;
        }

        .form-label {
            color: rgba(226, 232, 240, .78);
            font-weight: 800;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .form-control::placeholder {
            color: rgba(148, 163, 184, .72);
        }

        .form-control:focus,
        .form-select:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .auto-list-header {
            position: relative;
            z-index: 2;
            padding: 1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: .75rem;
            flex-wrap: wrap;
        }

        .auto-list-title {
            color: var(--hud-text);
            font-weight: 900;
            margin-bottom: 0;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .auto-list-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .auto-table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .auto-table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .auto-table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .auto-table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .id-pill,
        .data-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 800;
        }

        .data-pill {
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            border-color: rgba(255, 255, 255, .10);
        }

        .family-name {
            color: #fff;
            font-weight: 800;
        }

        .text-ellipsis {
            max-width: 260px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .status-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 92px;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-weight: 900;
            font-size: .72rem;
            letter-spacing: .06em;
        }

        .actions-wrap {
            display: flex;
            justify-content: flex-end;
            gap: .35rem;
            flex-wrap: wrap;
        }

        .empty-state {
            padding: 2rem;
            text-align: center;
            color: rgba(226, 232, 240, .62);
        }

        .auto-pagination {
            position: relative;
            z-index: 10;
            margin-top: 1rem;
        }

        .auto-pagination .pagination {
            flex-wrap: wrap;
            gap: .35rem;
            justify-content: center;
        }

        .auto-pagination .page-link {
            border-radius: 12px !important;
            color: #a7eefb;
            background: rgba(15, 23, 42, .90);
            border: 1px solid rgba(167, 238, 251, .20);
        }

        .auto-pagination .page-item.active .page-link {
            color: #04111f;
            background: #67e8f9;
            border-color: #67e8f9;
        }

        @media (max-width: 991.98px) {
            .actions-wrap {
                justify-content: flex-start;
            }
        }

        @media (max-width: 575.98px) {
            .auto-admin-page {
                padding-top: 1rem;
            }

            .container {
                padding-left: .75rem;
                padding-right: .75rem;
            }

            .hud-card {
                border-radius: 20px;
            }

            .auto-hero,
            .auto-filter,
            .auto-list-header,
            .auto-list-body {
                padding: 1rem;
            }

            .auto-list-header {
                align-items: flex-start;
            }

            .auto-filter .btn,
            .auto-hero .btn {
                width: 100%;
            }

            .text-ellipsis {
                max-width: 180px;
            }

            .actions-wrap {
                display: grid;
                grid-template-columns: 1fr;
                width: 100%;
            }

            .actions-wrap .btn,
            .actions-wrap form,
            .actions-wrap form button {
                width: 100%;
            }
        }

/* ===== resources\views\admin\auto_registration\show.blade.php :: <style> ===== */
.auto-show-page {
            padding: 2rem 0 3rem;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid rgba(45, 212, 191, .20);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .auto-hero {
            padding: 1.5rem;
            margin-bottom: 1rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .42rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .76rem;
            font-weight: 800;
            letter-spacing: .07em;
            text-transform: uppercase;
        }

        .auto-title {
            color: #f8fafc;
            font-size: clamp(1.45rem, 3vw, 2.15rem);
            font-weight: 850;
            margin: .85rem 0 .35rem;
        }

        .auto-subtitle {
            color: rgba(226, 232, 240, .68);
            margin-bottom: 0;
            overflow-wrap: anywhere;
        }

        .data-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 999px;
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            border: 1px solid rgba(255, 255, 255, .10);
            font-weight: 800;
        }

        .actions-wrap {
            display: flex;
            justify-content: flex-end;
            gap: .45rem;
            flex-wrap: wrap;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .info-card-header {
            position: relative;
            z-index: 2;
            padding: 1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            color: #f8fafc;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .info-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .info-item {
            padding: .85rem 0;
            border-bottom: 1px solid rgba(148, 163, 184, .12);
        }

        .info-item:last-child {
            border-bottom: 0;
        }

        .info-label {
            color: rgba(226, 232, 240, .58);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .06em;
            margin-bottom: .25rem;
        }

        .info-value {
            color: #f8fafc;
            font-weight: 750;
            overflow-wrap: anywhere;
        }

        .children-count-box {
            margin-top: 1rem;
            padding: 1rem;
            border-radius: 18px;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .20);
            color: rgba(248, 250, 252, .86);
        }

        .auto-table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .auto-table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .auto-table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .auto-table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .empty-state {
            padding: 2rem;
            text-align: center;
            border-radius: 18px;
            color: rgba(226, 232, 240, .72);
            background: rgba(245, 158, 11, .10);
            border: 1px solid rgba(245, 158, 11, .25);
        }

        @media (max-width: 575.98px) {
            .auto-show-page {
                padding-top: 1rem;
            }

            .container {
                padding-left: .75rem;
                padding-right: .75rem;
            }

            .hud-card {
                border-radius: 20px;
            }

            .auto-hero,
            .info-card-header,
            .info-card-body {
                padding: 1rem;
            }

            .actions-wrap {
                display: grid;
                grid-template-columns: 1fr;
                width: 100%;
                margin-top: .75rem;
            }

            .actions-wrap .btn,
            .actions-wrap form,
            .actions-wrap form button {
                width: 100%;
            }

            .auto-table {
                min-width: 720px;
            }
        }

/* ===== resources\views\admin\backups\index.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\admin\backups\index.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\admin\cookie-consents\index.blade.php :: <style> ===== */
.btn-outline-neon {
    border-color: #a7eefb;
    color: #a7eefb;
    }

    .btn-outline-neon:hover {
    border-color: #6dd1f8;
    color: #303c61;
    background-color: #a7eefb;
    }
    .btn-neon {
    border-color: #a7eefb;
    background-color: #a7eefb;
    color: #303c61;
    }

    .btn-neon:hover {
    border-color: #6dd1f8;
    color: #303c61;
    background-color: #a7eefb;
    }

    .bg-neon {
    color: #a7eefb;
    }
    .text-neon {
    color: #a7eefb;
    }
    .ip-hud-link {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 6px 10px;
        border-radius: 6px;
        color: #a7eefb;
        text-decoration: none;
        border: 1px solid rgba(45,212,191,.28);
        background:
            radial-gradient(circle at 20% 20%, rgba(167,238,251,.18), transparent 35%),
            rgba(15,23,42,.72);
        box-shadow:
            inset 0 0 14px rgba(45,212,191,.10),
            0 0 16px rgba(45,212,191,.12);
        overflow: hidden;
        transition: .2s ease;
    }

    .ip-hud-link::after {
        content: "";
        position: absolute;
        inset: -80%;
        background: linear-gradient(
            115deg,
            transparent 44%,
            rgba(167,238,251,.20) 50%,
            transparent 56%
        );
        transform: translateX(-45%) rotate(10deg);
        animation: ipHudScan 4.5s ease-in-out infinite;
        pointer-events: none;
    }

    .ip-hud-link i,
    .ip-hud-link code {
        position: relative;
        z-index: 2;
    }

    .ip-hud-link code {
        background: transparent;
        border: none;
        color: #2dd4bf;
        padding: 0;
    }

    .ip-hud-link:hover {
        color: #67e8f9;
        border-color: rgba(103,232,249,.72);
        transform: translateY(-1px);
        box-shadow:
            inset 0 0 18px rgba(45,212,191,.18),
            0 0 24px rgba(45,212,191,.32);
    }

    .ip-hud-external {
        font-size: .75rem;
        opacity: .75;
    }

    .ip-hud-pulse {
        position: relative;
        z-index: 2;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #2dd4bf;
        box-shadow: 0 0 12px rgba(45,212,191,.9);
        animation: ipHudPulse 1.6s ease-in-out infinite;
    }

    @keyframes ipHudPulse {
        0%, 100% {
            opacity: .55;
            transform: scale(.9);
        }
        50% {
            opacity: 1;
            transform: scale(1.25);
        }
    }

    @keyframes ipHudScan {
        0%, 45% {
            transform: translateX(-45%) rotate(10deg);
        }
        70%, 100% {
            transform: translateX(45%) rotate(10deg);
        }
    }

/* ===== resources\views\admin\cookie-consents\index.blade.php :: @push(css) ===== */

    .btn-outline-neon {
    border-color: #a7eefb;
    color: #a7eefb;
    }

    .btn-outline-neon:hover {
    border-color: #6dd1f8;
    color: #303c61;
    background-color: #a7eefb;
    }
    .btn-neon {
    border-color: #a7eefb;
    background-color: #a7eefb;
    color: #303c61;
    }

    .btn-neon:hover {
    border-color: #6dd1f8;
    color: #303c61;
    background-color: #a7eefb;
    }

    .bg-neon {
    color: #a7eefb;
    }
    .text-neon {
    color: #a7eefb;
    }
    .ip-hud-link {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 6px 10px;
        border-radius: 6px;
        color: #a7eefb;
        text-decoration: none;
        border: 1px solid rgba(45,212,191,.28);
        background:
            radial-gradient(circle at 20% 20%, rgba(167,238,251,.18), transparent 35%),
            rgba(15,23,42,.72);
        box-shadow:
            inset 0 0 14px rgba(45,212,191,.10),
            0 0 16px rgba(45,212,191,.12);
        overflow: hidden;
        transition: .2s ease;
    }

    .ip-hud-link::after {
        content: "";
        position: absolute;
        inset: -80%;
        background: linear-gradient(
            115deg,
            transparent 44%,
            rgba(167,238,251,.20) 50%,
            transparent 56%
        );
        transform: translateX(-45%) rotate(10deg);
        animation: ipHudScan 4.5s ease-in-out infinite;
        pointer-events: none;
    }

    .ip-hud-link i,
    .ip-hud-link code {
        position: relative;
        z-index: 2;
    }

    .ip-hud-link code {
        background: transparent;
        border: none;
        color: #2dd4bf;
        padding: 0;
    }

    .ip-hud-link:hover {
        color: #67e8f9;
        border-color: rgba(103,232,249,.72);
        transform: translateY(-1px);
        box-shadow:
            inset 0 0 18px rgba(45,212,191,.18),
            0 0 24px rgba(45,212,191,.32);
    }

    .ip-hud-external {
        font-size: .75rem;
        opacity: .75;
    }

    .ip-hud-pulse {
        position: relative;
        z-index: 2;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #2dd4bf;
        box-shadow: 0 0 12px rgba(45,212,191,.9);
        animation: ipHudPulse 1.6s ease-in-out infinite;
    }

    @keyframes ipHudPulse {
        0%, 100% {
            opacity: .55;
            transform: scale(.9);
        }
        50% {
            opacity: 1;
            transform: scale(1.25);
        }
    }

    @keyframes ipHudScan {
        0%, 45% {
            transform: translateX(-45%) rotate(10deg);
        }
        70%, 100% {
            transform: translateX(45%) rotate(10deg);
        }
    }

/* ===== resources\views\admin\dashboard.blade.php :: <style> ===== */
.dt-buttons{display:none!important;visibility:hidden!important;}

/* ===== DASHBOARD MODERN STYLES ===== */
        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: #a7eefb;
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        /* Hero Section */
        .dashboard-hero{
            position:relative;
            overflow:hidden;
            border-radius:1px;
            border:1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .dashboard-hero::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.5rem;
            padding:.6rem 1rem;
            border-radius:8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color:#2dd4bf;
            font-size:.85rem;
            font-weight:700;
            letter-spacing:0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title{
            color:#fff;
            font-weight:800;
            margin-bottom:.5rem;
            font-size:2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle{
            color:rgba(255,255,255,.75);
            margin-bottom:0;
            font-size:1rem;
        }

        /* HUD Card */
        .hud-card{
            border:1px solid rgba(45, 212, 191, 0.2);
            border-radius:1px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            position:relative;
            overflow:hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .hud-card::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.08), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events:none;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer{
            position:relative;
            z-index:2;
        }

        .hud-card .card-header{
            border-bottom:1px solid rgba(45, 212, 191, 0.1);
            background:transparent;
            padding: 1.25rem !important;
        }

        .hud-title{
            color:#fff;
            font-weight:700;
            text-transform:uppercase;
            letter-spacing:.6px;
            font-size: 0.95rem;
        }

        .hud-soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.45rem .75rem;
            border-radius:8px;
            font-size:.8rem;
            line-height:1;
            border:1px solid rgba(45, 212, 191, 0.3);
            background:rgba(45, 212, 191, 0.1);
            color:#2dd4bf;
            backdrop-filter:blur(10px);
            transition: all 0.3s ease;
        }

        .hud-soft-badge.badge-room{
            background:rgba(250,204,21,.12);
            border-color:rgba(250,204,21,.4);
            color:#fbbf24;
        }

        .hud-soft-badge.badge-blue{
            border-color:rgba(59,130,246,.4);
            color:#60a5fa;
        }

        .hud-soft-badge.badge-green{
            border-color:rgba(34,197,94,.4);
            color:#4ade80;
        }

        .hud-soft-badge.badge-red{
            border-color:rgba(239,68,68,.4);
            color:#f87171;
        }

        .hud-soft-badge.badge-yellow{
            border-color:rgba(250,204,21,.4);
            color:#fbbf24;
        }

        /* Stat Box */
        .hud-stat-box{
            border:1px solid rgba(45, 212, 191, 0.2);
            border-radius:12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            padding:1.5rem;
            height:100%;
            position:relative;
            overflow:hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeInUp 0.6s ease-out;
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .hud-stat-box::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.1), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events:none;
        }

        .hud-stat-box:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .hud-stat-box > *{
            position:relative;
            z-index:2;
        }

        .hud-stat-box .label{
            font-size:.8rem;
            text-transform:uppercase;
            color:rgba(255,255,255,.65);
            font-weight:700;
            letter-spacing:.08em;
        }

        .hud-stat-box .value{
            margin-top:.6rem;
            font-size:1.5rem;
            font-weight:800;
            color:#fff;
            line-height:1.2;
        }

        .hud-card-text{
            color:rgba(255,255,255,.75);
            line-height: 1.6;
        }

        .hud-total-text{
            color:rgba(255,255,255,.70);
            font-size:.9rem;
        }

        .hud-total-text .value{
            color:#2dd4bf;
            font-weight:700;
        }

/* ===== BOOK FLIP ANIMATION ===== */
        .book-flip-wrapper {
            perspective: 1200px;
            position: relative;
        }

        .book-card-flip {
            position: relative;
            width: 100%;
            min-height: 240px;
            transform-style: preserve-3d;
            transition: transform 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        }

        .book-flip-wrapper:hover .book-card-flip {
            transform: rotateY(180deg);
        }

        .book-face {
            position: absolute;
            inset: 0;
            padding: 1.5rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: var(--dark-gradient);
            border: 1px solid rgba(45, 212, 191, 0.3);
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .book-flip-wrapper:hover .book-face {
            border-color: rgba(45, 212, 191, 0.8);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.5),
                0 0 30px rgba(45, 212, 191, 0.4),
                0 20px 50px rgba(0, 0, 0, 0.5);
        }

        .book-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: 1rem;
        }

        .book-front-icon {
            font-size: 3.5rem;
            color: #2dd4bf;
            opacity: 0.9;
            transition: all 0.3s ease;
        }

        .book-flip-wrapper:hover .book-front-icon {
            color: #a78bfa;
            transform: scale(1.1);
        }

        .book-front-title {
            font-weight: 700;
            font-size: 1.1rem;
            color: #fff;
        }

        .book-front-sub {
            font-size: .85rem;
            text-transform: uppercase;
            letter-spacing: .16em;
            color: rgba(255,255,255,.6);
        }

        .book-back {
            transform: rotateY(180deg);
        }

        .book-back .book-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .book-back p {
            font-size: .9rem;
            color: rgba(255,255,255,.8);
        }

        /* Chart Container */
        #chartdiv {
            width: 100%;
            height: 500px;
        }

        /* Cards General */
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        /* Badge Styles */
        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .badge.bg-neon {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(167, 139, 250, 0.15)) !important;
            border: 1px solid rgba(45, 212, 191, 0.4);
            color: #2dd4bf;
        }

        /* Button Styles */
        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }

        .text-neon {
            color: #2dd4bf;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

        /* Responsive */
        @media (max-width: 1200px) {
            .dashboard-hero-title {
                font-size: 1.75rem;
            }

            .hud-stat-box .value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 767.98px){
            .dashboard-hero {
                border-radius: 1px;
            }

            #chartdiv {
                height: 380px;
            }

            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .hud-stat-box {
                padding: 1.25rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .book-face {
                padding: 1.25rem;
                min-height: 200px;
            }

            .book-front-icon {
                font-size: 2.5rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-stat-box .value {
                font-size: 1.1rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\admin\dashboard.blade.php :: @push(css) ===== */

        .dt-buttons{display:none!important;visibility:hidden!important;}

/* ===== resources\views\admin\events\edit.blade.php :: <style> ===== */
.hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }
        .text-dim { color: rgba(255,255,255,.65); }
        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .form-hint { font-size: .85rem; color: rgba(255,255,255,.55); }
        .pill{
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            border-radius: 999px;
            padding: .35rem .6rem;
            display: inline-flex;
            align-items: center;
            gap: .4rem;
        }

        /* petit polish HUD */
        .form-control, .form-select {
            background-color: rgba(255,255,255,.04);
            border-color: rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .form-control:focus, .form-select:focus {
            border-color: rgba(0,208,132,.55);
            box-shadow: 0 0 0 .15rem rgba(0,208,132,.15);
        }
        .form-control::placeholder { color: rgba(255,255,255,.45); }

/* ===== resources\views\admin\events\edit.blade.php :: @push(css) ===== */

        .hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }
        .text-dim { color: rgba(255,255,255,.65); }
        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .form-hint { font-size: .85rem; color: rgba(255,255,255,.55); }
        .pill{
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            border-radius: 999px;
            padding: .35rem .6rem;
            display: inline-flex;
            align-items: center;
            gap: .4rem;
        }

        /* petit polish HUD */
        .form-control, .form-select {
            background-color: rgba(255,255,255,.04);
            border-color: rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .form-control:focus, .form-select:focus {
            border-color: rgba(0,208,132,.55);
            box-shadow: 0 0 0 .15rem rgba(0,208,132,.15);
        }
        .form-control::placeholder { color: rgba(255,255,255,.45); }

/* ===== resources\views\admin\events\index.blade.php :: <style> ===== */
:root {
        --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
        --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
        --neon-cyan: #2dd4bf;
        --neon-purple: #a78bfa;
        --neon-yellow: #fbbf24;
        --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }

    @keyframes slideInDown {
        from { opacity: 0; transform: translateY(-20px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    @keyframes glow-pulse {
        0%, 100% { box-shadow: 0 0 5px rgba(45, 212, 191, 0.3); }
        50% { box-shadow: 0 0 20px rgba(45, 212, 191, 0.6); }
    }

    .modal-backdrop { background: transparent !important; pointer-events: none !important; }

    #calendar {
        height: 100%;
        min-height: 500px;
        max-height: 600px;
        overflow-y: auto;
    }

    .dt-buttons, .dt-length { display:none !important; visibility:hidden !important; }

    .table { font-size: 12px !important; font-weight: lighter !important; }

/* ===== AVATARS ===== */
    .modal-user-avatar,
    .avatar-cell img {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        object-fit: cover;
        border: 2px solid rgba(45, 212, 191, 0.3);
        transition: var(--transition-smooth);
    }

    .avatar-cell img:hover {
        border-color: rgba(45, 212, 191, 0.8);
        box-shadow: 0 0 12px rgba(45, 212, 191, 0.4);
        transform: scale(1.1);
    }

/* ===== CARTES ===== */
    .card {
        border: 1px solid rgba(45, 212, 191, 0.2) !important;
        border-radius: 12px !important;
        background: var(--dark-gradient) !important;
        box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
        transition: var(--transition-smooth);
        animation: fadeIn 0.6s ease-out;
        position: relative;
        overflow: hidden;
    }

    .card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
        pointer-events: none;
        z-index: 1;
    }

    .card > * {
        position: relative;
        z-index: 2;
    }

    .card:hover {
        border-color: rgba(45, 212, 191, 0.5) !important;
        box-shadow:
            0 0 30px rgba(45, 212, 191, 0.2),
            0 20px 50px rgba(0, 0, 0, 0.3) !important;
        transform: translateY(-4px);
    }

    .card-header {
        background: transparent !important;
        border-color: rgba(45, 212, 191, 0.1) !important;
        padding: 1.25rem !important;
    }

    .card-body {
        padding: 1.5rem !important;
    }

/* ===== FORMULAIRES ===== */
    .form-control,
    .form-select,
    select {
        border-color: rgba(45, 212, 191, 0.2) !important;
        background-color: rgba(15, 23, 42, 0.55) !important;
        color: #e5e7eb;
        border-radius: 8px;
        transition: var(--transition-smooth);
    }

    .form-control:focus,
    .form-select:focus,
    select:focus {
        border-color: rgba(45, 212, 191, 0.65) !important;
        box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15) !important;
        color: #fff;
        background-color: rgba(15, 23, 42, 0.75) !important;
    }

    .form-control::placeholder {
        color: rgba(255,255,255,.4);
    }

    .form-label {
        color: rgba(255,255,255,.82);
        font-weight: 600;
        text-transform: uppercase;
        font-size: .85rem;
        letter-spacing: 0.5px;
    }

/* ===== BOUTONS ===== */
    .btn {
        border-radius: 8px;
        font-weight: 600;
        letter-spacing: 0.4px;
        transition: var(--transition-smooth);
        padding: 0.65rem 1.5rem;
    }

    .btn-sm {
        padding: .45rem .7rem;
        font-size: .85rem;
    }

    .btn-primary {
        background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
        border-color: rgba(45, 212, 191, 0.4);
        color: #0f172a;
        font-weight: 600;
    }

    .btn-primary:hover {
        border-color: rgba(45, 212, 191, 0.7);
        box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
        transform: translateY(-2px);
    }

    .btn-outline-success {
        border-color: rgba(16, 185, 129, 0.4);
        color: #10b981;
    }

    .btn-outline-success:hover {
        background: rgba(16, 185, 129, 0.1);
        border-color: rgba(16, 185, 129, 0.7);
        color: #fff;
        transform: translateY(-2px);
    }

    .btn-outline-secondary {
        border-color: rgba(45, 212, 191, 0.3);
        color: var(--neon-cyan);
    }

    .btn-outline-secondary:hover {
        background: rgba(45, 212, 191, 0.1);
        border-color: rgba(45, 212, 191, 0.6);
        color: #fff;
        transform: translateY(-2px);
    }

    .btn-outline-neon {
        border-color: var(--neon-cyan);
        color: var(--neon-cyan);
        background: transparent;
    }

    .btn-outline-neon:hover {
        border-color: var(--neon-purple);
        color: #fff;
        background: linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(167, 139, 250, 0.2));
        box-shadow: 0 0 20px rgba(45, 212, 191, 0.3);
        transform: translateY(-2px);
    }

/* ===== TABLEAUX ===== */
    .table {
        --bs-table-bg: transparent;
        --bs-table-color: #fff;
        --bs-table-border-color: rgba(45, 212, 191, 0.1);
    }

    .table thead th {
        color: #f8fafc;
        font-size: .84rem;
        font-weight: 700;
        border-bottom-width: 2px;
        border-bottom-color: rgba(45, 212, 191, 0.2) !important;
        background: rgba(45, 212, 191, 0.05);
        vertical-align: middle;
        white-space: nowrap;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .table tbody tr {
        transition: var(--transition-smooth);
        border-bottom-color: rgba(45, 212, 191, 0.08) !important;
    }

    .table tbody tr:hover {
        background-color: rgba(45, 212, 191, 0.08) !important;
        box-shadow: inset 0 0 15px rgba(45, 212, 191, 0.05);
    }

    .table tbody td {
        color: rgba(255,255,255,.92);
        vertical-align: middle;
    }

    .table a {
        color: var(--neon-cyan);
        transition: var(--transition-smooth);
        text-decoration: none;
    }

    .table a:hover {
        color: var(--neon-purple);
        text-shadow: 0 0 10px rgba(45, 212, 191, 0.4);
    }

/* ===== TEXT ===== */
    .text-neon {
        background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    <!-- ===== ALERTES ===== -->
    .alert {
        border-radius: 8px;
        border: 1px solid rgba(45, 212, 191, 0.2);
        background: rgba(45, 212, 191, 0.05);
        animation: slideInDown 0.4s ease-out;
    }

    .alert-success {
        background: rgba(16, 185, 129, 0.05) !important;
        border-color: rgba(16, 185, 129, 0.2) !important;
        color: #bbf7d0 !important;
    }

    .alert-danger {
        background: rgba(239, 68, 68, 0.05) !important;
        border-color: rgba(239, 68, 68, 0.2) !important;
        color: #fecaca !important;
    }

/* ===== resources\views\admin\events\index.blade.php :: @push(css) ===== */

    :root {
        --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
        --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
        --neon-cyan: #2dd4bf;
        --neon-purple: #a78bfa;
        --neon-yellow: #fbbf24;
        --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }

    @keyframes slideInDown {
        from { opacity: 0; transform: translateY(-20px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes fadeInUp {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
    }

    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    @keyframes glow-pulse {
        0%, 100% { box-shadow: 0 0 5px rgba(45, 212, 191, 0.3); }
        50% { box-shadow: 0 0 20px rgba(45, 212, 191, 0.6); }
    }

    .modal-backdrop { background: transparent !important; pointer-events: none !important; }

    #calendar {
        height: 100%;
        min-height: 500px;
        max-height: 600px;
        overflow-y: auto;
    }

    .dt-buttons, .dt-length { display:none !important; visibility:hidden !important; }

    .table { font-size: 12px !important; font-weight: lighter !important; }

/* ===== resources\views\admin\events\show.blade.php :: <style> ===== */
.row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }

        .avatar{
            width: 64px; height: 64px; border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.18);
            background: rgba(255,255,255,.06);
        }

        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }

        .text-dim { color: rgba(255,255,255,.65); }
        .kv dt { color: rgba(255,255,255,.65); font-weight: 500; }
        .kv dd { margin-bottom: .35rem; }
        .table thead th { white-space: nowrap; }

        .switch {
            min-width: 320px;
        }

/* ===== resources\views\admin\events\show.blade.php :: @push(css) ===== */

        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }

        .avatar{
            width: 64px; height: 64px; border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.18);
            background: rgba(255,255,255,.06);
        }

        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }

        .text-dim { color: rgba(255,255,255,.65); }
        .kv dt { color: rgba(255,255,255,.65); font-weight: 500; }
        .kv dd { margin-bottom: .35rem; }
        .table thead th { white-space: nowrap; }

        .switch {
            min-width: 320px;
        }

/* ===== resources\views\admin\login_logs\index.blade.php :: <style> ===== */
.modal { z-index: 2060 !important; }
        .modal-backdrop { z-index: 2050 !important; }
        .card, .table-responsive { overflow: visible; }

/* ===== resources\views\admin\login_logs\index.blade.php :: @push(css) ===== */

        .modal { z-index: 2060 !important; }
        .modal-backdrop { z-index: 2050 !important; }
        .card, .table-responsive { overflow: visible; }

/* ===== resources\views\admin\messages.blade.php :: <style> ===== */
.dt-buttons {
            display:none !important;
            visibility: hidden !important;
        }
        .dt-length{
            display:none !important;
            visibility: hidden !important;
        }

/* ===== resources\views\admin\newsletter-send.blade.php :: <style> ===== */
body, table, td { font-family: Arial, Helvetica, sans-serif; }
table { border-collapse: collapse; }
img { border:0; display:block; }
.arabic { direction: rtl; text-align: right; font-family: Tahoma, Arial, sans-serif; }

/* ===== resources\views\admin\orders\customers.blade.php :: <style> ===== */
/* Même hauteur des cards par ligne */
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex:1 1 auto; }

        .table td, .table th { vertical-align: middle; }
        .text-truncate-2 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .badge-soft {
            background: rgba(13,110,253,.1);
            color: #0d6efd;
            border: 1px solid rgba(13,110,253,.2);
        }
        .badge-soft-success {
            background: rgba(25,135,84,.12);
            color: #198754;
            border: 1px solid rgba(25,135,84,.2);
        }
        .badge-soft-secondary {
            background: rgba(108,117,125,.12);
            color: #6c757d;
            border: 1px solid rgba(108,117,125,.2);
        }
        .filters .form-control, .filters .form-select { min-width: 180px; }
        @media (max-width: 576px) {
            .filters .form-control, .filters .form-select { min-width: 100%; }
        }

/* ===== resources\views\admin\orders\customers.blade.php :: @push(css) ===== */

        /* Même hauteur des cards par ligne */
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex:1 1 auto; }

        .table td, .table th { vertical-align: middle; }
        .text-truncate-2 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .badge-soft {
            background: rgba(13,110,253,.1);
            color: #0d6efd;
            border: 1px solid rgba(13,110,253,.2);
        }
        .badge-soft-success {
            background: rgba(25,135,84,.12);
            color: #198754;
            border: 1px solid rgba(25,135,84,.2);
        }
        .badge-soft-secondary {
            background: rgba(108,117,125,.12);
            color: #6c757d;
            border: 1px solid rgba(108,117,125,.2);
        }
        .filters .form-control, .filters .form-select { min-width: 180px; }
        @media (max-width: 576px) {
            .filters .form-control, .filters .form-select { min-width: 100%; }
        }

/* ===== resources\views\admin\orders\index.blade.php :: <style> ===== */
.badge-status{font-size:.8rem}
        .table-orders td{vertical-align: middle}
        .text-mono{font-family: ui-monospace, SFMono-Regular, Menlo, monospace}

/* ===== resources\views\admin\orders\show.blade.php :: <style> ===== */
.card-rounded{border-radius:14px}
        .key{color:#6c757d}
        .text-mono{font-family: ui-monospace, SFMono-Regular, Menlo, monospace}
        .table-items th, .table-items td{vertical-align: middle}
        .badge-status{font-size:.85rem}

/* ===== resources\views\admin\reminders\preview_user.blade.php :: <style> ===== */
.user-card { border-radius: 14px; }
        .user-profile-image {
            border-radius: 10px;
            background: #f8f9fa;
        }
        .meta-row .meta-box {
            border: 1px solid rgba(251, 251, 251, 0.8);
            border-radius: 4px;
            padding: .75rem .9rem;
            background: transparent;
            height: 100%;
        }
        .meta-box .label {
            font-size: .85rem;
            color: #cdcdd1;
            margin-bottom: .15rem;
        }
        .meta-box .value {
            font-weight: 700;
            letter-spacing: .2px;
        }
        @media (max-width: 576px){
            .card-header .btn { padding: .35rem .6rem; }
        }

/* ===== resources\views\admin\reminders\preview_user.blade.php :: @push(css) ===== */

        .user-card { border-radius: 14px; }
        .user-profile-image {
            border-radius: 10px;
            background: #f8f9fa;
        }
        .meta-row .meta-box {
            border: 1px solid rgba(251, 251, 251, 0.8);
            border-radius: 4px;
            padding: .75rem .9rem;
            background: transparent;
            height: 100%;
        }
        .meta-box .label {
            font-size: .85rem;
            color: #cdcdd1;
            margin-bottom: .15rem;
        }
        .meta-box .value {
            font-weight: 700;
            letter-spacing: .2px;
        }
        @media (max-width: 576px){
            .card-header .btn { padding: .35rem .6rem; }
        }

/* ===== resources\views\admin\reminders\users_index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #77c6cf;
            --hud-cyan: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
        }

        .reminders-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .reminder-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .reminder-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .reminder-subtitle {
            color: var(--hud-muted);
        }

        .search-box {
            position: relative;
            min-width: 280px;
        }

        .search-box i {
            position: absolute;
            left: .9rem;
            top: 50%;
            transform: translateY(-50%);
            color: rgba(255,255,255,.45);
        }

        .search-box input {
            padding-left: 2.45rem;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
            min-height: 42px;
        }

        .search-box input::placeholder {
            color: rgba(255,255,255,.45);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .checkbox-lg {
            width: 1.25rem;
            height: 1.25rem;
            accent-color: var(--hud-neon);
            cursor: pointer;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 1080px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .parent-name {
            font-weight: 800;
            color: #fff;
        }

        .parent-email {
            color: var(--hud-cyan);
            word-break: break-word;
        }

        .money-paid {
            color: #86efac;
            font-weight: 800;
            white-space: nowrap;
        }

        .money-annual {
            color: #bfdbfe;
            font-weight: 800;
            white-space: nowrap;
        }

        .money-due {
            color: #fecaca;
            font-weight: 900;
            white-space: nowrap;
        }

        .level-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 36px;
            height: 30px;
            padding: 0 .65rem;
            border-radius: 999px;
            background: rgba(250,204,21,.12);
            border: 1px solid rgba(250,204,21,.28);
            color: #fde68a;
            font-weight: 900;
        }

        .date-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .4rem .65rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.78);
            font-size: .82rem;
            white-space: nowrap;
        }

        .actions-wrap {
            display: flex;
            align-items: center;
            gap: .45rem;
            flex-wrap: wrap;
        }

        .pagination-wrap {
            padding: 1rem 0 0;
        }

        .pagination-wrap .pagination {
            margin-bottom: 0;
            flex-wrap: wrap;
            gap: .25rem;
        }

        .pagination-wrap .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .pagination-wrap .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .reminder-hero {
                padding: 1rem;
            }

            .hero-actions,
            .filter-form {
                width: 100%;
                flex-direction: column;
                align-items: stretch !important;
            }

            .search-box {
                width: 100%;
                min-width: 0;
            }

            .filter-form .btn,
            .hero-actions .btn {
                width: 100%;
            }

            .pagination-wrap {
                flex-direction: column;
                align-items: stretch !important;
            }
        }

/* ===== resources\views\admin\reports\users_absences_contribs.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

/* ===== TITRES ===== */
        h3.text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 700;
            animation: slideInDown 0.6s ease-out;
        }

/* ===== CARTES ===== */
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: var(--transition-smooth);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
            z-index: 1;
        }

        .card > * {
            position: relative;
            z-index: 2;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-header,
        .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .card-body {
            padding: 1.5rem !important;
        }

/* ===== FORMULAIRES ===== */
        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2) !important;
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 4px;
            padding: .575rem .75rem !important;
            transition: var(--transition-smooth);
        }

        .form-control:focus,
        .form-select:focus,
        select:focus {
            border-color: rgba(45, 212, 191, 0.65) !important;
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15) !important;
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 500;
        }

/* ===== BOUTONS ===== */

        .btn-primary {
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            border-color: rgba(45, 212, 191, 0.4);
            color: #0f172a;
            font-weight: 600;
        }

        .btn-primary:hover {
            border-color: rgba(45, 212, 191, 0.7);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
        }

        .btn-danger {
            background: linear-gradient(135deg, #ef4444, #dc2626);
            border-color: rgba(239, 68, 68, 0.4);
            color: #fff;
        }

        .btn-danger:hover {
            border-color: rgba(239, 68, 68, 0.7);
            box-shadow: 0 0 20px rgba(239, 68, 68, 0.4);
            transform: translateY(-2px);
        }
        .btn-warning {
            background: linear-gradient(135deg, #f59e0b, #d97706);
            border-color: rgba(245, 158, 11, 0.4);
            color: #fff;
        }

        /* Button Styles */
        .btn {
            border-radius: 4px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }

        .text-neon {
            color: #2dd4bf;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== BADGES ===== */
        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
            padding: 0.45rem 0.75rem;
        }

        .badge.text-bg-light {
            background: rgba(243, 244, 246, 0.2) !important;
            color: #e5e7eb;
            border: 1px solid rgba(243, 244, 246, 0.3);
        }

/* ===== TABLES ===== */
        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            color: rgba(255,255,255,.92);
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            border-bottom-color: rgba(45, 212, 191, 0.2) !important;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            padding: 0.9rem !important;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08) !important;
            padding: 0.9rem !important;
        }

        .table tbody tr {
            transition: var(--transition-smooth);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(45, 212, 191, 0.04);
            background-color: rgba(45, 212, 191, 0.04) !important;
        }

        .table-hover > tbody > tr:hover > * {
            --bs-table-accent-bg: rgba(45, 212, 191, 0.12);
            background-color: rgba(45, 212, 191, 0.12) !important;
            color: #fff;
        }

        .table a {
            color: #ffffff;
            text-decoration: none;
            transition: var(--transition-smooth);
            font-weight: 600;
        }

        .table a:hover {
            color: #afffff;
        }

/* ===== CHECKBOX ===== */
        .form-check-input {
            width: 1.25rem;
            height: 1.55rem;
            accent-color: #2dd4bf;
            cursor: pointer;
            border-color: rgba(45, 212, 191, 0.3);
            background-color: rgba(15, 23, 42, 0.55);
            transition: var(--transition-smooth);
        }

        .form-check-input:hover {
            filter: drop-shadow(0 0 8px rgba(45, 212, 191, 0.4));
        }

        .form-check-input:checked {
            background-color: #2dd4bf;
            border-color: #2dd4bf;
        }

/* ===== TEXT ===== */
        .text-neon {
            color: #a7eefb;
        }

        .text-yellow {
            color: #fbbf24;
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

/* ===== RESPONSIVE ===== */
        .table-responsive {
            border-radius: 12px;
            overflow: hidden;
        }

        @media (max-width: 991.98px) {
            .table thead th {
                font-size: .78rem;
                padding: 0.7rem !important;
            }

            .table tbody td {
                font-size: .88rem;
                padding: 0.7rem !important;
            }

            .btn {
                padding: 0.55rem 1rem;
            }
        }

        @media (max-width: 767.98px) {
            .card {
                border-radius: 12px !important;
            }

            .table thead th {
                font-size: .75rem;
                padding: 0.5rem !important;
            }

            .table tbody td {
                font-size: .80rem;
                padding: 0.5rem !important;
            }

            .btn {
                padding: 0.5rem 0.8rem;
                font-size: 0.85rem;
            }

            .btn-sm {
                padding: .35rem .5rem;
                font-size: .75rem;
            }
        }

        @media (max-width: 575.98px) {
            h3 {
                font-size: 1.25rem;
            }

            .table-responsive {
                font-size: .75rem;
            }

            .table thead th {
                font-size: .7rem;
                padding: 0.4rem !important;
            }

            .table tbody td {
                font-size: .75rem;
                padding: 0.4rem !important;
            }

            .form-control,
            .form-select {
                font-size: .85rem;
            }
        }

/* ===== resources\views\admin\snapshots\index.blade.php :: <style> ===== */
.snapshot-hero {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            padding: 28px;
            color: #fff;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .35), transparent 35%),
                linear-gradient(135deg, #0f172a, #1e293b);
            box-shadow: 0 18px 45px rgba(15, 23, 42, .25);
        }

        .snapshot-hero::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                120deg,
                transparent,
                rgba(255,255,255,.08),
                transparent
            );
            transform: translateX(-100%);
            animation: snapshotScan 5s infinite;
        }

        @keyframes snapshotScan {
            0% { transform: translateX(-100%); }
            60%, 100% { transform: translateX(100%); }
        }

        .snapshot-card {
            border: 0;
            border-radius: 1px;
            box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
            overflow: hidden;
        }

        .snapshot-stat {
            border-radius: 8px;
            padding: 18px;
            background: linear-gradient(135deg, rgba(45,212,191,.10), rgba(14,165,233,.08));
            border: 1px solid rgba(45,212,191,.25);
        }

        .snapshot-icon {
            width: 46px;
            height: 46px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45, 212, 191, .15);
            color: #0f766e;
            font-size: 20px;
        }

        .snapshot-file {
            font-size: .875rem;
            background: #162a34;
            padding: 6px 10px;
            border-radius: 2px;
        }

        .btn-snapshot {
            border-radius: 14px;
            font-weight: 600;
            padding: 10px 16px;
        }

        .snapshot-muted {
            color: #a7eefb;
        }

        .snapshot-warning {
            border-left: 4px solid #f59e0b;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .35), transparent 35%),
                linear-gradient(135deg, #0f172a, #1e293b);
            box-shadow: 0 18px 45px rgba(15, 23, 42, .25);
        }
        /* Button Styles */
        .btn {
            border-radius: 4px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }
        .text-neon {
            color: #2dd4bf;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\admin\snapshots\index.blade.php :: @push(css) ===== */

        .snapshot-hero {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            padding: 28px;
            color: #fff;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .35), transparent 35%),
                linear-gradient(135deg, #0f172a, #1e293b);
            box-shadow: 0 18px 45px rgba(15, 23, 42, .25);
        }

        .snapshot-hero::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(
                120deg,
                transparent,
                rgba(255,255,255,.08),
                transparent
            );
            transform: translateX(-100%);
            animation: snapshotScan 5s infinite;
        }

        @keyframes snapshotScan {
            0% { transform: translateX(-100%); }
            60%, 100% { transform: translateX(100%); }
        }

        .snapshot-card {
            border: 0;
            border-radius: 1px;
            box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
            overflow: hidden;
        }

        .snapshot-stat {
            border-radius: 8px;
            padding: 18px;
            background: linear-gradient(135deg, rgba(45,212,191,.10), rgba(14,165,233,.08));
            border: 1px solid rgba(45,212,191,.25);
        }

        .snapshot-icon {
            width: 46px;
            height: 46px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45, 212, 191, .15);
            color: #0f766e;
            font-size: 20px;
        }

        .snapshot-file {
            font-size: .875rem;
            background: #162a34;
            padding: 6px 10px;
            border-radius: 2px;
        }

        .btn-snapshot {
            border-radius: 14px;
            font-weight: 600;
            padding: 10px 16px;
        }

        .snapshot-muted {
            color: #a7eefb;
        }

        .snapshot-warning {
            border-left: 4px solid #f59e0b;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .35), transparent 35%),
                linear-gradient(135deg, #0f172a, #1e293b);
            box-shadow: 0 18px 45px rgba(15, 23, 42, .25);
        }
        /* Button Styles */
        .btn {
            border-radius: 4px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }
        .text-neon {
            color: #2dd4bf;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\affectations\index.blade.php :: <style> ===== */

/* ===== NEON HOVER SUR LES CARDS ===== */
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }
        .text-neon {
            color: #a7eefb;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #39c5e6;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\allowances\form.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .allowance-form-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .form-section {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            margin-bottom: 1rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .form-label {
            color: rgba(255,255,255,.70);
            font-weight: 800;
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        .form-text,
        .text-muted {
            color: rgba(255,255,255,.55) !important;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .summary-pill {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.82);
            font-size: .84rem;
            font-weight: 700;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 767.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .form-actions {
                flex-direction: column;
            }

            .form-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\allowances\form.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .allowance-form-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .form-section {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            margin-bottom: 1rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .form-label {
            color: rgba(255,255,255,.70);
            font-weight: 800;
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        .form-text,
        .text-muted {
            color: rgba(255,255,255,.55) !important;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .summary-pill {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.82);
            font-size: .84rem;
            font-weight: 700;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 767.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .form-actions {
                flex-direction: column;
            }

            .form-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\allowances\index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .allowances-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .summary-box {
            height: 100%;
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .summary-mini {
            color: rgba(255,255,255,.70);
            font-size: .86rem;
        }

        .summary-label {
            font-size: .78rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.60);
            font-weight: 800;
            letter-spacing: .05em;
        }

        .summary-value {
            margin-top: .35rem;
            font-size: 1.5rem;
            font-weight: 900;
            color: #fff;
            line-height: 1.2;
        }

        .metric-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.04);
            height: 100%;
        }

        .metric-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .metric-value {
            color: #fff;
            font-size: 1.15rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .hud-progress {
            height: 12px;
            background: rgba(255,255,255,.10);
            border-radius: 999px;
            overflow: hidden;
        }

        .hud-progress .progress-bar {
            background: linear-gradient(90deg, #2dd4bf, #22c55e);
            border-radius: 999px;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .amount-strong {
            font-weight: 900;
            color: #86efac;
            white-space: nowrap;
        }

        .status-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
        }

        .status-paid {
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.28);
            color: #bbf7d0;
        }

        .status-pending {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.28);
            color: #fde68a;
        }

        .hud-action-link {
            color: var(--hud-cyan);
            text-decoration: none;
        }

        .hud-action-link:hover {
            color: #fff;
        }

        .hud-icon-btn {
            border: none;
            background: none;
            cursor: pointer;
            padding: 0;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_filter input::placeholder {
            color: rgba(255,255,255,.45);
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .allowance-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .allowance-topbar .btn,
            .allowance-actions .btn {
                width: 100%;
            }

            .allowance-actions {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .summary-value {
                font-size: 1.2rem;
            }

            .metric-value {
                font-size: 1rem;
            }
        }

/* ===== resources\views\allowances\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .allowances-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .summary-box {
            height: 100%;
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .summary-mini {
            color: rgba(255,255,255,.70);
            font-size: .86rem;
        }

        .summary-label {
            font-size: .78rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.60);
            font-weight: 800;
            letter-spacing: .05em;
        }

        .summary-value {
            margin-top: .35rem;
            font-size: 1.5rem;
            font-weight: 900;
            color: #fff;
            line-height: 1.2;
        }

        .metric-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.04);
            height: 100%;
        }

        .metric-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .metric-value {
            color: #fff;
            font-size: 1.15rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .hud-progress {
            height: 12px;
            background: rgba(255,255,255,.10);
            border-radius: 999px;
            overflow: hidden;
        }

        .hud-progress .progress-bar {
            background: linear-gradient(90deg, #2dd4bf, #22c55e);
            border-radius: 999px;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .amount-strong {
            font-weight: 900;
            color: #86efac;
            white-space: nowrap;
        }

        .status-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
        }

        .status-paid {
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.28);
            color: #bbf7d0;
        }

        .status-pending {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.28);
            color: #fde68a;
        }

        .hud-action-link {
            color: var(--hud-cyan);
            text-decoration: none;
        }

        .hud-action-link:hover {
            color: #fff;
        }

        .hud-icon-btn {
            border: none;
            background: none;
            cursor: pointer;
            padding: 0;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_filter input::placeholder {
            color: rgba(255,255,255,.45);
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .allowance-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .allowance-topbar .btn,
            .allowance-actions .btn {
                width: 100%;
            }

            .allowance-actions {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .summary-value {
                font-size: 1.2rem;
            }

            .metric-value {
                font-size: 1rem;
            }
        }

/* ===== resources\views\allowances\show.blade.php :: <style> ===== */
.kv {
            display: grid;
            grid-template-columns: 220px 1fr;
            gap: .5rem 1rem;
        }
        .kv .k { color: #6c757d; }
        .badge-status { font-size: .9rem; }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\allowances\show.blade.php :: @push(css) ===== */

        .kv {
            display: grid;
            grid-template-columns: 220px 1fr;
            gap: .5rem 1rem;
        }
        .kv .k { color: #6c757d; }
        .badge-status { font-size: .9rem; }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\announcements\admin\create.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\announcements\admin\create.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\announcements\admin\edit.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\admin\edit.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\admin\index.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\admin\index.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\index.blade.php :: <style> ===== */
.ann-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 2px;
            background: #1b1c20;
            color: #fff;
            transition: .25s ease;
            box-shadow: 0 10px 25px rgba(0,0,0,.15);
            overflow: hidden;
        }
        .ann-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 14px 30px rgba(0,0,0,.25);
        }
        .ann-badge {
            display: inline-block;
            padding: .55rem .7rem;
            border-radius: 2px;
            font-size: .78rem;
            font-weight: 600;
            background: rgba(13, 202, 240, .15);
            color: #7dd3fc;
        }
        .ann-meta {
            font-size: .88rem;
            color: #b7bcc5;
        }
        .ann-cover {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\index.blade.php :: @push(css) ===== */

        .ann-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 2px;
            background: #1b1c20;
            color: #fff;
            transition: .25s ease;
            box-shadow: 0 10px 25px rgba(0,0,0,.15);
            overflow: hidden;
        }
        .ann-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 14px 30px rgba(0,0,0,.25);
        }
        .ann-badge {
            display: inline-block;
            padding: .55rem .7rem;
            border-radius: 2px;
            font-size: .78rem;
            font-weight: 600;
            background: rgba(13, 202, 240, .15);
            color: #7dd3fc;
        }
        .ann-meta {
            font-size: .88rem;
            color: #b7bcc5;
        }
        .ann-cover {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\show.blade.php :: <style> ===== */
.ann-show-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 2px;
            background: #1b1c20;
            color: #fff;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }
        .ann-show-cover {
            width: 100%;
            max-height: 380px;
            object-fit: cover;
        }
        .ann-content {
            line-height: 1.8;
            font-size: 1rem;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\announcements\show.blade.php :: @push(css) ===== */

        .ann-show-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 2px;
            background: #1b1c20;
            color: #fff;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }
        .ann-show-cover {
            width: 100%;
            max-height: 380px;
            object-fit: cover;
        }
        .ann-content {
            line-height: 1.8;
            font-size: 1rem;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\assets\index.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\assets\index.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\assets\show.blade.php :: <style> ===== */
.kv { display:flex; gap:.5rem; }
        .kv .k { min-width:160px; color:#6c757d; }
        .badge-cap { text-transform:capitalize; }
        .text-trunc { max-width: 520px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\assets\show.blade.php :: @push(css) ===== */

        .kv { display:flex; gap:.5rem; }
        .kv .k { min-width:160px; color:#6c757d; }
        .badge-cap { text-transform:capitalize; }
        .text-trunc { max-width: 520px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\assignments\index.blade.php :: <style> ===== */
.fc .fc-toolbar-title { font-size: 1.15rem; }
        .card-h100 { height: 100%; }
        .calendar-wrap { min-height: 680px; }
        .table-wrap { min-height: 680px; overflow: auto; }
        .badge-room { font-size: .75rem; }

        .table-responsive { overflow-x: auto; }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        /* =========================
           GLOBAL HUD STYLE
        ========================= */
        .hud-card {
            border: 1px solid rgba(148, 163, 184, .20);
            border-radius: 1px;
            position: relative;
            overflow: hidden;
            background: transparent;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            z-index: 0;
        }

        .hud-card::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 40%);
            pointer-events: none;
            z-index: 1;
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer {
            position: relative;
            z-index: 2;
            background: transparent !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.07);
            color: #fff;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            color: #fff;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(148,163,184,.18);
            box-shadow: 0 10px 30px rgba(0,0,0,.08);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 4px;
            background: #111827;
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 1px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(4px);
        }

        .soft-badge.badge-room {
            background: rgba(255,255,255,.04);
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.22);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.22);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.22);
            color: #fecaca;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.22);
            color: #cbd5e1;
        }

        /* =========================
           TABLE HUD
        ========================= */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .table-hud-wrap .table a {
            color: #fff;
        }

        .table-hud-wrap .table a:hover {
            color: #fde68a;
        }

        .table-hud-wrap .text-muted,
        .hud-card .text-muted,
        .hud-card .form-text,
        .hud-card .small.text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .hud-table-scroll {
            overflow-x: auto;
            overflow-y: auto;
            max-height: 70vh;
        }

        /* =========================
           FULLCALENDAR HUD
        ========================= */
        .fc {
            color: #fff;
        }

        .fc .fc-toolbar-title {
            color: #fff;
            font-weight: 700;
        }

        .fc .fc-button {
            background: rgba(255,255,255,.08) !important;
            border: 1px solid rgba(255,255,255,.10) !important;
            color: #fff !important;
            box-shadow: none !important;
        }

        .fc .fc-button:hover,
        .fc .fc-button.fc-button-active {
            background: rgba(255,255,255,.14) !important;
            color: #fde68a !important;
        }

        .fc-theme-standard td,
        .fc-theme-standard th,
        .fc-theme-standard .fc-scrollgrid {
            border-color: rgba(255,255,255,.08) !important;
        }

        .fc .fc-col-header-cell-cushion,
        .fc .fc-daygrid-day-number {
            color: #fff;
            text-decoration: none;
        }

        .fc .fc-daygrid-day.fc-day-today {
            background: rgba(250,204,21,.08) !important;
        }

        .fc .fc-list,
        .fc .fc-view-harness,
        .fc .fc-scrollgrid {
            background: transparent !important;
        }

        /* =========================
           PAGINATION
        ========================= */
        .pagination .page-link {
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .pagination .page-item.active .page-link {
            background: #0d6efd;
            border-color: #0d6efd;
            color: #fff;
        }

        .pagination .page-link:hover {
            color: #fde68a;
            background: rgba(255,255,255,.10);
        }

        @media (max-width: 768px) {
            .fc .fc-toolbar {
                flex-direction: column;
                gap: .75rem;
            }

            .fc .fc-toolbar-chunk {
                display: flex;
                justify-content: center;
                flex-wrap: wrap;
                gap: .35rem;
            }
        }

        @media (max-width: 991.98px) {
            .hero-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .hero-actions .btn,
            .hero-actions a {
                width: 100%;
            }
        }
        .text-neon {
            color: #a7eefb;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fafafa;
            background-color: #457985;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\assignments\index.blade.php :: @push(css) ===== */

        .fc .fc-toolbar-title { font-size: 1.15rem; }
        .card-h100 { height: 100%; }
        .calendar-wrap { min-height: 680px; }
        .table-wrap { min-height: 680px; overflow: auto; }
        .badge-room { font-size: .75rem; }

        .table-responsive { overflow-x: auto; }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        /* =========================
           GLOBAL HUD STYLE
        ========================= */
        .hud-card {
            border: 1px solid rgba(148, 163, 184, .20);
            border-radius: 1px;
            position: relative;
            overflow: hidden;
            background: transparent;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            z-index: 0;
        }

        .hud-card::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 40%);
            pointer-events: none;
            z-index: 1;
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer {
            position: relative;
            z-index: 2;
            background: transparent !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.07);
            color: #fff;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            color: #fff;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(148,163,184,.18);
            box-shadow: 0 10px 30px rgba(0,0,0,.08);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 4px;
            background: #111827;
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 1px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(4px);
        }

        .soft-badge.badge-room {
            background: rgba(255,255,255,.04);
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.22);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.22);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.22);
            color: #fecaca;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.22);
            color: #cbd5e1;
        }

        /* =========================
           TABLE HUD
        ========================= */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .table-hud-wrap .table a {
            color: #fff;
        }

        .table-hud-wrap .table a:hover {
            color: #fde68a;
        }

        .table-hud-wrap .text-muted,
        .hud-card .text-muted,
        .hud-card .form-text,
        .hud-card .small.text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .hud-table-scroll {
            overflow-x: auto;
            overflow-y: auto;
            max-height: 70vh;
        }

        /* =========================
           FULLCALENDAR HUD
        ========================= */
        .fc {
            color: #fff;
        }

        .fc .fc-toolbar-title {
            color: #fff;
            font-weight: 700;
        }

        .fc .fc-button {
            background: rgba(255,255,255,.08) !important;
            border: 1px solid rgba(255,255,255,.10) !important;
            color: #fff !important;
            box-shadow: none !important;
        }

        .fc .fc-button:hover,
        .fc .fc-button.fc-button-active {
            background: rgba(255,255,255,.14) !important;
            color: #fde68a !important;
        }

        .fc-theme-standard td,
        .fc-theme-standard th,
        .fc-theme-standard .fc-scrollgrid {
            border-color: rgba(255,255,255,.08) !important;
        }

        .fc .fc-col-header-cell-cushion,
        .fc .fc-daygrid-day-number {
            color: #fff;
            text-decoration: none;
        }

        .fc .fc-daygrid-day.fc-day-today {
            background: rgba(250,204,21,.08) !important;
        }

        .fc .fc-list,
        .fc .fc-view-harness,
        .fc .fc-scrollgrid {
            background: transparent !important;
        }

        /* =========================
           PAGINATION
        ========================= */
        .pagination .page-link {
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .pagination .page-item.active .page-link {
            background: #0d6efd;
            border-color: #0d6efd;
            color: #fff;
        }

        .pagination .page-link:hover {
            color: #fde68a;
            background: rgba(255,255,255,.10);
        }

        @media (max-width: 768px) {
            .fc .fc-toolbar {
                flex-direction: column;
                gap: .75rem;
            }

            .fc .fc-toolbar-chunk {
                display: flex;
                justify-content: center;
                flex-wrap: wrap;
                gap: .35rem;
            }
        }

        @media (max-width: 991.98px) {
            .hero-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .hero-actions .btn,
            .hero-actions a {
                width: 100%;
            }
        }
        .text-neon {
            color: #a7eefb;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fafafa;
            background-color: #457985;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\auth\login.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .16), transparent 35%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .login-page {
            min-height: calc(100vh - 120px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 3rem 1rem;
        }

        .login-card {
            position: relative;
            width: 100%;
            max-width: 520px;
            border: 1px solid rgba(45, 212, 191, .22);
            border-radius: 24px;
            overflow: hidden;
            background: rgba(7, 16, 28, .92);
            box-shadow: 0 25px 70px rgba(0, 0, 0, .45), 0 0 40px rgba(45, 212, 191, .08);
            backdrop-filter: blur(16px);
        }

        .login-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .14), transparent 35%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
            z-index: 0;
        }

        .login-header,
        .login-body {
            position: relative;
            z-index: 2;
        }

        .login-header {
            padding: 2rem 2rem 1.25rem;
            border-bottom: 1px solid rgba(255, 255, 255, .08);
        }

        .login-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 700;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .login-title {
            margin-top: 1rem;
            margin-bottom: .35rem;
            color: #f8fafc;
            font-size: 1.5rem;
            font-weight: 500;
        }

        .login-subtitle {
            color: rgba(226, 232, 240, .72);
            margin-bottom: 0;
        }

        .login-clock {
            margin-top: 1rem;
            color: #67e8f9;
            font-size: .85rem;
            font-weight: 600;
        }

        .login-body {
            padding: 2rem;
        }

        .form-label {
            color: rgba(226, 232, 240, .88);
            font-weight: 700;
            margin-bottom: .5rem;
        }

        .login-control {
            height: 48px;
            border-radius: 14px;
            color: #f8fafc;
            background: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .22);
        }

        .login-control::placeholder {
            color: rgba(148, 163, 184, .7);
        }

        .login-control:focus {
            color: #fff;
            background: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .password-wrapper {
            position: relative;
        }

        .password-wrapper .login-control {
            padding-right: 3.5rem !important;
        }

        .password-toggle {
            position: absolute;
            right: .55rem;
            top: 24px;
            transform: translateY(-50%);
            z-index: 5;
            border: 0;
            width: 38px;
            height: 38px;
            border-radius: 12px;
            color: #cbd5e1;
            background: rgba(255, 255, 255, .08);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }

        .password-toggle:hover {
            color: #fff;
            background: rgba(45, 212, 191, .18);
        }

        .btn-login {
            width: 100%;
            height: 50px;
            border: 0;
            border-radius: 16px;
            color: #04111f;
            font-weight: 800;
            background: linear-gradient(135deg, #77c6cf, #77c6cf);
            box-shadow: 0 4px 10px rgba(45, 212, 191, .28);
            transition: all .2s ease;
        }

        .btn-login:hover {
            background: #55a6ac;
            box-shadow: 0 6px 10px rgba(45, 212, 191, .36);
        }

        .forgot-link {
            display: inline-flex;
            justify-content: center;
            margin-top: 1rem;
            color: #93c5fd;
            font-weight: 700;
            text-decoration: none;
        }

        .forgot-link:hover {
            color: #bfdbfe;
            text-decoration: underline;
        }

        .invalid-feedback {
            font-weight: 600;
        }

        @media (max-width: 575.98px) {
            .login-page {
                align-items: flex-start;
                padding-top: 2rem;
            }

            .login-header,
            .login-body {
                padding: 1.4rem;
            }

            .login-card {
                border-radius: 20px;
            }
        }

/* ===== resources\views\auth\passwords\email.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .16), transparent 35%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .reset-page {
            min-height: calc(100vh - 120px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 3rem 1rem;
        }

        .reset-card {
            position: relative;
            width: 100%;
            max-width: 620px;
            overflow: hidden;
            border-radius: 26px;
            background: rgba(7, 16, 28, .92);
            border: 1px solid rgba(45, 212, 191, .22);
            box-shadow:
                0 25px 70px rgba(0, 0, 0, .45),
                0 0 40px rgba(45, 212, 191, .08);
            backdrop-filter: blur(16px);
        }

        .reset-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .14), transparent 35%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
            z-index: 0;
        }

        .reset-header,
        .reset-body {
            position: relative;
            z-index: 2;
        }

        .reset-header {
            padding: 2rem 2rem 1.25rem;
            border-bottom: 1px solid rgba(255, 255, 255, .08);
        }

        .reset-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .reset-title {
            margin-top: 1rem;
            margin-bottom: .35rem;
            color: #f8fafc;
            font-size: clamp(1.5rem, 3vw, 2rem);
            font-weight: 700;
        }

        .reset-subtitle {
            color: rgba(226, 232, 240, .72);
            margin-bottom: 0;
        }

        .reset-body {
            padding: 2rem;
        }

        .form-label {
            color: rgba(226, 232, 240, .88);
            font-weight: 700;
            margin-bottom: .5rem;
        }

        .reset-control {
            height: 48px;
            border-radius: 14px;
            color: #f8fafc;
            background: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .22);
        }

        .reset-control::placeholder {
            color: rgba(148, 163, 184, .72);
        }

        .reset-control:focus {
            color: #fff;
            background: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .btn-reset {
            width: 100%;
            min-height: 50px;
            border: 0;
            border-radius: 16px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #418da4, #ade1ed);
            box-shadow: 0 12px 30px rgba(45, 212, 191, .28);
            transition: all .2s ease;
        }

        .btn-reset:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 40px rgba(45, 212, 191, .36);
        }

        .reset-info {
            margin-top: 1.5rem;
            padding: 1rem;
            border-radius: 18px;
            color: rgba(226, 232, 240, .78);
            background: rgba(59, 130, 246, .10);
            border: 1px solid rgba(96, 165, 250, .22);
            line-height: 1.65;
        }

        .reset-info i {
            color: #93c5fd;
        }

        .reset-alert-success {
            border-radius: 16px;
            color: #d1fae5;
            background: rgba(34, 197, 94, .12);
            border: 1px solid rgba(34, 197, 94, .28);
        }

        .invalid-feedback {
            font-weight: 600;
        }

        @media (max-width: 575.98px) {
            .reset-page {
                align-items: flex-start;
                padding-top: 2rem;
            }

            .reset-header,
            .reset-body {
                padding: 1.4rem;
            }

            .reset-card {
                border-radius: 20px;
            }
        }

/* ===== resources\views\auth\passwords\reset.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .16), transparent 35%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .reset-page {
            min-height: calc(100vh - 120px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 3rem 1rem;
        }

        .reset-card {
            position: relative;
            width: 100%;
            max-width: 720px;
            overflow: hidden;
            border-radius: 26px;
            background: rgba(7, 16, 28, .92);
            border: 1px solid rgba(45, 212, 191, .22);
            box-shadow:
                0 25px 70px rgba(0, 0, 0, .45),
                0 0 40px rgba(45, 212, 191, .08);
            backdrop-filter: blur(16px);
        }

        .reset-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .14), transparent 35%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
            z-index: 0;
        }

        .reset-header,
        .reset-body {
            position: relative;
            z-index: 2;
        }

        .reset-header {
            padding: 2rem 2rem 1.25rem;
            border-bottom: 1px solid rgba(255, 255, 255, .08);
        }

        .reset-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .reset-title {
            margin-top: 1rem;
            margin-bottom: .35rem;
            color: #f8fafc;
            font-size: clamp(1.5rem, 3vw, 2rem);
            font-weight: 700;
        }

        .reset-subtitle {
            color: rgba(226, 232, 240, .72);
            margin-bottom: 0;
        }

        .reset-body {
            padding: 2rem;
        }

        .form-label {
            color: rgba(226, 232, 240, .88);
            font-weight: 700;
            margin-bottom: .5rem;
        }

        .reset-control {
            height: 48px;
            border-radius: 14px;
            color: #f8fafc;
            background: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .22);
        }

        .reset-control::placeholder {
            color: rgba(148, 163, 184, .72);
        }

        .reset-control:focus {
            color: #fff;
            background: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .password-wrapper {
            position: relative;
        }

        .password-wrapper .reset-control {
            padding-right: 3.5rem !important;
        }

        .password-toggle {
            position: absolute;
            right: .55rem;
            top: 24px;
            transform: translateY(-50%);
            z-index: 5;
            border: 0;
            width: 38px;
            height: 38px;
            border-radius: 12px;
            color: #cbd5e1;
            background: rgba(255, 255, 255, .08);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }

        .password-toggle:hover {
            color: #fff;
            background: rgba(45, 212, 191, .18);
        }

        .btn-reset {
            width: 100%;
            min-height: 50px;
            border: 0;
            border-radius: 16px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 30px rgba(45, 212, 191, .28);
            transition: all .2s ease;
        }

        .btn-reset:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 40px rgba(45, 212, 191, .36);
        }

        .invalid-feedback {
            font-weight: 600;
        }

        @media (max-width: 575.98px) {
            .reset-page {
                align-items: flex-start;
                padding-top: 2rem;
            }

            .reset-header,
            .reset-body {
                padding: 1.4rem;
            }

            .reset-card {
                border-radius: 20px;
            }
        }

/* ===== resources\views\auto_registration\entry.blade.php :: <style> ===== */
body {
            background:
                radial-gradient(circle at top left, rgba(34, 211, 238, .12), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .12), transparent 35%),
                #07101c;
        }

        .auto-page {
            color: #e5e7eb;
        }

        .form-control {
            background-color: #042b5a !important;
            padding: 0.75rem 1rem !important;
            border: 1px solid #77c6cf !important;
            color: #e5e7eb !important;
            transition: all .25s ease;
        }

        .form-control::placeholder {
            color: rgba(229, 231, 235, .55);
        }

        .form-control:focus {
            background-color: #06366f !important;
            border-color: #22d3ee !important;
            box-shadow: 0 0 0 .2rem rgba(34, 211, 238, .18) !important;
            color: #fff !important;
        }

        .auto-card {
            background:
                radial-gradient(900px 320px at 15% 0%, rgba(13,110,253,.16), transparent 60%),
                radial-gradient(700px 280px at 95% 15%, rgba(34,211,238,.14), transparent 55%),
                linear-gradient(180deg, rgba(255,255,255,.06), rgba(15,23,42,.96));
            border: 1px solid rgba(34, 211, 238, .18);
            border-radius: 18px;
            color: #e5e7eb;
        }

        .procedure-card {
            position: sticky;
            top: 95px;
            background:
                radial-gradient(circle at top right, rgba(34,211,238,.18), transparent 42%),
                radial-gradient(circle at bottom left, rgba(168,85,247,.14), transparent 45%),
                linear-gradient(135deg, rgba(7,16,28,.98), rgba(15,23,42,.98));
            border: 1px solid rgba(34,211,238,.28);
            border-radius: 22px;
            box-shadow:
                0 0 0 1px rgba(34,211,238,.08),
                0 22px 55px rgba(0,0,0,.42),
                0 0 35px rgba(34,211,238,.12);
            overflow: hidden;
        }

        .procedure-img {
            width: 100%;
            height: auto;
            border-radius: 18px;
            border: 1px solid rgba(34,211,238,.22);
            box-shadow: 0 18px 35px rgba(0,0,0,.38);
        }

        .info-chip {
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.09);
            color: #dbeafe;
        }

        .condition-box {
            background: rgba(15, 23, 42, .62);
            backdrop-filter: blur(8px);
            border: 1px solid rgba(56, 189, 248, .25);
            border-radius: 16px;
            box-shadow: 0 0 0 1px rgba(34, 211, 238, .10), 0 10px 30px rgba(0,0,0,.25);
            color: #e5e7eb;
        }

        .hero-img {
            width: 100%;
            height: 350px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(34,211,238,.18);
            box-shadow: 0 18px 35px rgba(0,0,0,.30);
        }

        @media (max-width: 991.98px) {
            .hero-img {
                height: 260px;
            }

            .procedure-card {
                position: relative;
                top: auto;
                margin-top: 1.5rem;
            }
        }

        @media (max-width: 575.98px) {
            .hero-img {
                height: 210px;
            }

            .page-title-row {
                flex-direction: column;
                align-items: flex-start !important;
            }
        }

/* ===== resources\views\auto_registration\entry.blade.php :: @push(css) ===== */

        body {
            background:
                radial-gradient(circle at top left, rgba(34, 211, 238, .12), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .12), transparent 35%),
                #07101c;
        }

        .auto-page {
            color: #e5e7eb;
        }

        .form-control {
            background-color: #042b5a !important;
            padding: 0.75rem 1rem !important;
            border: 1px solid #77c6cf !important;
            color: #e5e7eb !important;
            transition: all .25s ease;
        }

        .form-control::placeholder {
            color: rgba(229, 231, 235, .55);
        }

        .form-control:focus {
            background-color: #06366f !important;
            border-color: #22d3ee !important;
            box-shadow: 0 0 0 .2rem rgba(34, 211, 238, .18) !important;
            color: #fff !important;
        }

        .auto-card {
            background:
                radial-gradient(900px 320px at 15% 0%, rgba(13,110,253,.16), transparent 60%),
                radial-gradient(700px 280px at 95% 15%, rgba(34,211,238,.14), transparent 55%),
                linear-gradient(180deg, rgba(255,255,255,.06), rgba(15,23,42,.96));
            border: 1px solid rgba(34, 211, 238, .18);
            border-radius: 18px;
            color: #e5e7eb;
        }

        .procedure-card {
            position: sticky;
            top: 95px;
            background:
                radial-gradient(circle at top right, rgba(34,211,238,.18), transparent 42%),
                radial-gradient(circle at bottom left, rgba(168,85,247,.14), transparent 45%),
                linear-gradient(135deg, rgba(7,16,28,.98), rgba(15,23,42,.98));
            border: 1px solid rgba(34,211,238,.28);
            border-radius: 22px;
            box-shadow:
                0 0 0 1px rgba(34,211,238,.08),
                0 22px 55px rgba(0,0,0,.42),
                0 0 35px rgba(34,211,238,.12);
            overflow: hidden;
        }

        .procedure-img {
            width: 100%;
            height: auto;
            border-radius: 18px;
            border: 1px solid rgba(34,211,238,.22);
            box-shadow: 0 18px 35px rgba(0,0,0,.38);
        }

        .info-chip {
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.09);
            color: #dbeafe;
        }

        .condition-box {
            background: rgba(15, 23, 42, .62);
            backdrop-filter: blur(8px);
            border: 1px solid rgba(56, 189, 248, .25);
            border-radius: 16px;
            box-shadow: 0 0 0 1px rgba(34, 211, 238, .10), 0 10px 30px rgba(0,0,0,.25);
            color: #e5e7eb;
        }

        .hero-img {
            width: 100%;
            height: 350px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(34,211,238,.18);
            box-shadow: 0 18px 35px rgba(0,0,0,.30);
        }

        @media (max-width: 991.98px) {
            .hero-img {
                height: 260px;
            }

            .procedure-card {
                position: relative;
                top: auto;
                margin-top: 1.5rem;
            }
        }

        @media (max-width: 575.98px) {
            .hero-img {
                height: 210px;
            }

            .page-title-row {
                flex-direction: column;
                align-items: flex-start !important;
            }
        }

/* ===== resources\views\bbb\index.blade.php :: <style> ===== */
.form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        /* =========================
           GLOBAL HUD STYLE
        ========================= */
        .hud-card {
            border: 1px solid rgba(148, 163, 184, .20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer {
            position: relative;
            z-index: 2;
        }

        .hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.07);
            background: transparent;
            color: #fff;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            color: #fff;
        }

        .hud-subtext {
            color: rgba(255,255,255,.62);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 4px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(4px);
        }

        .soft-badge.badge-room {
            background: rgba(255,255,255,.04);
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.22);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.22);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.22);
            color: #fecaca;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 4px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(148,163,184,.18);
            box-shadow: 0 10px 30px rgba(0,0,0,.08);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 4px;
            background: #111827;
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
        }

        /* =========================
           ROOM ITEMS
        ========================= */
        .room-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 1rem;
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
        }

        .room-item::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .room-item > * {
            position: relative;
            z-index: 2;
        }

        .room-item-main {
            min-width: 0;
            flex: 1;
        }

        .room-item-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .room-item-meta {
            color: rgba(255,255,255,.62);
            font-size: .84rem;
            margin-top: .25rem;
        }

        .room-item-actions {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: .5rem;
            min-width: 220px;
        }

        .room-stack {
            display: grid;
            gap: .9rem;
        }

        /* =========================
           TABLE HUD
        ========================= */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .table-hud-wrap .table a {
            color: #fff;
        }

        .table-hud-wrap .table a:hover {
            color: #fde68a;
        }

        .table-hud-wrap .text-muted,
        .hud-card .text-muted,
        .hud-card .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .section-title {
            color: #fff;
            font-weight: 700;
            margin-bottom: 1rem;
        }

        @media (max-width: 991.98px) {
            .room-item {
                flex-direction: column;
                align-items: stretch;
            }

            .room-item-actions {
                min-width: 100%;
                width: 100%;
                align-items: stretch;
            }

            .room-item-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .card-body {
                padding: .9rem;
            }

            .hud-card,
            .hero-light-card,
            .room-item {
                border-radius: 4px;
            }
        }

/* ===== resources\views\blood-pressure-readings\create.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\blood-pressure-readings\create.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\blood-pressure-readings\edit.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\blood-pressure-readings\edit.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\blood-pressure-readings\index.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #ffffff;
            background-color: #3ab7d3;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease !important;
        }

        .card:hover {
            background-color: #19202c !important;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

        .table > :not(caption) > * > * {
            padding-top: 0.9rem;
            padding-bottom: 0.9rem;
        }

        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12);
        }

        .bg-info-subtle {
            background-color: rgba(13, 202, 240, 0.12);
        }
        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12) !important;
        }

        .bg-info-subtle {
            background-color: rgba(13, 202, 240, 0.12) !important;
        }

/* ===== resources\views\blood-pressure-readings\index.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #ffffff;
            background-color: #3ab7d3;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease !important;
        }

        .card:hover {
            background-color: #19202c !important;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

        .table > :not(caption) > * > * {
            padding-top: 0.9rem;
            padding-bottom: 0.9rem;
        }

        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12);
        }

        .bg-info-subtle {
            background-color: rgba(13, 202, 240, 0.12);
        }
        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12) !important;
        }

        .bg-info-subtle {
            background-color: rgba(13, 202, 240, 0.12) !important;
        }

/* ===== resources\views\blood-pressure-readings\show.blade.php :: <style> ===== */
.btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\blood-pressure-readings\show.blade.php :: @push(css) ===== */

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\components\cookie-consent.blade.php :: <style> ===== */
.cookie-banner {
        position: fixed;
        inset: auto 20px 20px 20px;
        z-index: 2147483647 !important;
        justify-content: center;
    }

    .cookie-card {
        width: min(760px, 100%);
        background: rgba(15, 23, 42, .96);
        color: #fff;
        border: 1px solid rgba(45, 212, 191, .35);
        border-radius: 12px;
        padding: 22px;
        box-shadow: 0 22px 70px rgba(0, 0, 0, .45);
        backdrop-filter: blur(14px);
    }

    .cookie-header h5 {
        margin: 0 0 8px;
        font-weight: 800;
        color: #a7eefb;
    }

    .cookie-header p {
        margin: 0;
        color: rgba(255,255,255,.78);
        line-height: 1.55;
    }

    .cookie-actions {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: flex-end;
        margin-top: 18px;
    }

    .btn-cookie {
        border-radius: 4px;
        padding: 10px 18px;
        font-weight: 700;
        border: 1px solid transparent;
        cursor: pointer;
        transition: .2s ease;
    }

    .btn-primary-cookie {
        background: #2dd4bf;
        color: #0f172a;
        border-color: #2dd4bf;
    }

    .btn-primary-cookie:hover {
        background: #67e8f9;
        border-color: #67e8f9;
    }

    .btn-outline-cookie {
        background: transparent;
        color: #a7eefb;
        border-color: rgba(167, 238, 251, .65);
    }

    .btn-outline-cookie:hover {
        background: rgba(167, 238, 251, .12);
    }

    .cookie-settings {
        margin-top: 18px;
        border-top: 1px solid rgba(255,255,255,.12);
        padding-top: 16px;
    }

    .cookie-option {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 14px 0;
        border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .cookie-option small {
        display: block;
        color: rgba(255,255,255,.65);
        margin-top: 4px;
    }

    .cookie-option input {
        width: 22px;
        height: 22px;
        accent-color: #2dd4bf;
    }

    .cookie-footer {
        margin-top: 14px;
        display: flex;
        justify-content: space-between;
        gap: 10px;
        flex-wrap: wrap;
        font-size: .9rem;
    }

    .cookie-footer a,
    .cookie-link {
        color: #a7eefb;
        background: none;
        border: none;
        padding: 0;
        text-decoration: underline;
        cursor: pointer;
    }

    .cookie-floating-btn.hud-cookie-btn {
        position: fixed;
        left: 18px;
        bottom: 18px;
        z-index: 999998;
        width: 54px;
        height: 54px;
        padding: 0;
        border-radius: 50%;
        border: 1px solid rgba(45, 212, 191, .65);
        background:
            radial-gradient(circle at 30% 25%, rgba(167, 238, 251, .24), transparent 35%),
            linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .92));
        color: #a7eefb;
        display: none;
        align-items: center;
        justify-content: center;
        box-shadow:
            0 0 0 1px rgba(45, 212, 191, .12),
            0 0 22px rgba(45, 212, 191, .28),
            0 12px 34px rgba(0, 0, 0, .42);
        overflow: hidden;
        cursor: pointer;
        transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, color .2s ease;
    }

    .cookie-floating-btn.hud-cookie-btn i {
        position: relative;
        z-index: 2;
        font-size: 1.35rem;
        filter: drop-shadow(0 0 8px rgba(167, 238, 251, .55));
    }

    .cookie-floating-btn.hud-cookie-btn::before {
        content: "";
        position: absolute;
        inset: 7px;
        border-radius: 50%;
        border: 1px dashed rgba(167, 238, 251, .38);
        animation: hudCookieRotate 9s linear infinite;
    }

    .cookie-floating-btn.hud-cookie-btn::after {
        content: "";
        position: absolute;
        inset: -40%;
        background: linear-gradient(
            115deg,
            transparent 35%,
            rgba(167, 238, 251, .18) 48%,
            rgba(45, 212, 191, .35) 50%,
            rgba(167, 238, 251, .18) 52%,
            transparent 65%
        );
        transform: translateX(-70%) rotate(12deg);
        animation: hudCookieScan 3.8s ease-in-out infinite;
    }

    .hud-cookie-ring {
        position: absolute;
        inset: 3px;
        border-radius: 50%;
        border: 1px solid rgba(45, 212, 191, .22);
        box-shadow: inset 0 0 18px rgba(45, 212, 191, .18);
    }

    .cookie-floating-btn.hud-cookie-btn:hover {
        transform: translateY(-2px) scale(1.08);
        color: #0f172a;
        border-color: rgba(103, 232, 249, .95);
        box-shadow:
            0 0 0 1px rgba(103, 232, 249, .35),
            0 0 30px rgba(45, 212, 191, .52),
            0 16px 38px rgba(0, 0, 0, .5);
    }

    .cookie-floating-btn.hud-cookie-btn:hover i {
        color: #67e8f9;
    }

    @keyframes hudCookieRotate {
        to {
            transform: rotate(360deg);
        }
    }

    @keyframes hudCookieScan {
        0%, 45% {
            transform: translateX(-80%) rotate(12deg);
        }
        70%, 100% {
            transform: translateX(80%) rotate(12deg);
        }
    }

    @media (max-width: 576px) {
        .cookie-floating-btn.hud-cookie-btn {
            width: 50px;
            height: 50px;
            left: 14px;
            bottom: 14px;
        }
    }

    .d-none {
        display: none !important;
    }

    @media (max-width: 576px) {
        .cookie-banner {
            inset: auto 10px 10px 10px;
        }

        .cookie-card {
            padding: 18px;
            border-radius: 18px;
        }

        .cookie-actions {
            flex-direction: column-reverse;
        }

        .btn-cookie {
            width: 100%;
        }
    }
    .cookie-banner {
        pointer-events: auto;
    }

    .modal-backdrop {
        z-index: 1040;
    }

    .modal {
        z-index: 1055;
    }

/* ===== resources\views\components\login-modal.blade.php :: <style> ===== */
#check {
        border: #0b1c2c !important;
    }
    #loginModal .modal-content{
        border: 0;
        border-radius: 0.25rem;
        overflow: hidden;
        background: #ffffff;
        box-shadow: 0 20px 60px rgba(0,0,0,.18);
    }

    #loginModal .modal-header{
        border-bottom: 0;
        padding: 1.25rem 1.25rem 0.75rem;
        background: linear-gradient(135deg, #0d6efd, #0b5ed7);
        color: #fff;
    }

    #loginModal .modal-title{
        font-weight: 700;
        font-size: 1.15rem;
        display: flex;
        align-items: center;
    }

    #loginModal .btn-close{
        filter: brightness(0) invert(1);
        opacity: .9;
    }

    #loginModal .btn-close:hover{
        opacity: 1;
    }

    #loginModal .modal-body{
        padding: 1.5rem;
        background: #f8fafc;
    }

    #loginModal .login-intro{
        text-align: center;
        margin-bottom: 1.25rem;
    }

    #loginModal .login-icon{
        width: 72px;
        height: 72px;
        margin: 0 auto 12px;
        border-radius: 0.25rem;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(13, 110, 253, 0.1);
        color: #0d6efd;
        font-size: 2rem;
    }

    #loginModal .login-subtitle{
        color: #374951;
        font-size: .95rem;
        margin-bottom: 0;
    }

    #loginModal .form-label{
        font-weight: 600;
        color: #212529;
        margin-bottom: .45rem;
    }

    #loginModal .form-control{
        border-radius: 0.25rem;
        padding: .8rem .95rem;
        border: 1px solid #8cbafa;
        box-shadow: none;
        transition: all .2s ease;
        color: #212529;
    }

    #loginModal .form-control:focus{
        border-color: #5092f6;
        box-shadow: 0 0 0 .2rem rgba(13,110,253,.15);
    }

    #loginModal .form-check-label{
        color: #383f49;
        font-size: .95rem;
    }

    #loginModal .alert{
        border-radius: 0.25rem;
        border: 0;
        font-size: .92rem;
    }

    #loginModal .login-submit{
        border-radius: 0.25rem;
        padding: .8rem 1rem;
        font-weight: 700;
        width: 100%;
        background: linear-gradient(135deg, #0d6efd, #0b5ed7);
        border: none;
        color: #fff;
        transition: all .2s ease;
    }

    #loginModal .login-submit:hover{
        transform: translateY(-1px);
        box-shadow: 0 10px 25px rgba(13,110,253,.25);
    }

    #loginModal .forgot-link{
        color: #0d6efd;
        font-weight: 600;
        text-decoration: none;
    }

    #loginModal .forgot-link:hover{
        text-decoration: underline;
    }

    #loginModal .modal-footer-note{
        text-align: center;
        margin-top: 1rem;
    }

    #check1 {
        border: #0f4b6e !important;
    }

    @media (max-width: 576px){
        #loginModal .modal-body{
            padding: 1.15rem;
        }

        #loginModal .login-icon{
            width: 64px;
            height: 64px;
            font-size: 1.7rem;
        }
    }

/* ===== resources\views\components\newsletter-modal.blade.php :: <style> ===== */
:root{
        --hud-bg: #0b1220;
        --hud-bg-2: #111827;
        --hud-panel: rgba(10, 19, 36, 0.94);
        --hud-panel-2: rgba(17, 24, 39, 0.98);
        --hud-border: rgba(167, 238, 251, 0.18);
        --hud-border-strong: rgba(167, 238, 251, 0.48);
        --hud-text: #e7f8fc;
        --hud-text-soft: #98b4c0;
        --hud-neon: #a7eefb;
        --hud-neon-2: #6dd1f8;
        --hud-success: #86efac;
        --hud-danger: #fda4af;
        --hud-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.08),
            0 0 24px rgba(109, 209, 248, 0.12),
            0 22px 46px rgba(0, 0, 0, 0.58);
    }

/* ===== Buttons ===== */
    .btn-outline-neon {
        border: 1px solid var(--hud-neon);
        color: var(--hud-neon);
        background: transparent;
        transition: all .25s ease;
    }

    .btn-outline-neon:hover {
        border-color: var(--hud-neon-2);
        color: #0f172a;
        background: var(--hud-neon);
        box-shadow: 0 0 18px rgba(109, 209, 248, 0.30);
    }

    .btn-neon {
        position: relative;
        border: 1px solid rgba(167, 238, 251, 0.85);
        background: linear-gradient(180deg, #baf5ff 0%, #86e4ff 100%);
        color: #0f172a;
        font-weight: 700;
        transition: all .25s ease;
        box-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.20),
            0 0 20px rgba(109, 209, 248, 0.22);
    }

    .btn-neon:hover,
    .btn-neon:focus {
        color: #0f172a;
        border-color: #d9fbff;
        transform: translateY(-1px);
        box-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.30),
            0 0 14px rgba(109, 209, 248, 0.30),
            0 0 34px rgba(109, 209, 248, 0.26);
    }

    .btn-neon::after {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: inherit;
        background: radial-gradient(circle, rgba(109, 209, 248, 0.20), transparent 70%);
        opacity: 0;
        transition: opacity .25s ease;
        pointer-events: none;
    }

    .btn-neon:hover::after,
    .btn-neon:focus::after {
        opacity: 1;
    }

    .text-neon {
        color: var(--hud-neon) !important;
    }

    .bg-neon {
        background: var(--hud-neon) !important;
        color: #0f172a !important;
    }

/* ===== Trigger button ===== */
    .newsletter-trigger-btn {
        border-radius: 4px;
        padding: .6rem 1.1rem;
        letter-spacing: .2px;
    }

/* ===== Modal ===== */
    #newsletterModal .modal-dialog {
        max-width: 560px;
        position: relative;
        transform: scale(.96) translateY(10px);
        opacity: 0;
        transition: transform .28s ease, opacity .28s ease;
    }

    #newsletterModal.show .modal-dialog {
        transform: scale(1) translateY(0);
        opacity: 1;
    }

    #newsletterModal .modal-content {
        position: relative;
        overflow: hidden;
        border: 1px solid var(--hud-border);
        border-radius: 6px;
        background:
            radial-gradient(circle at top right, rgba(109, 209, 248, 0.12), transparent 30%),
            radial-gradient(circle at bottom left, rgba(167, 238, 251, 0.08), transparent 28%),
            linear-gradient(145deg, var(--hud-panel) 0%, var(--hud-panel-2) 100%);
        color: var(--hud-text);
        box-shadow: var(--hud-shadow);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        transition: border-color .35s ease, box-shadow .35s ease;
    }

    #newsletterModal .modal-content:hover {
        border-color: rgba(45, 212, 191, 0.9) !important;
        box-shadow:
            0 0 0 1px rgba(45, 212, 191, 0.35),
            0 0 18px rgba(45, 212, 191, 0.45),
            0 0 32px rgba(45, 212, 191, 0.22),
            0 18px 35px rgba(0, 0, 0, 0.45) !important;
    }

/* ===== HUD scanline effect ===== */
    #newsletterModal .modal-content::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background:
            repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,0.028) 0px,
                rgba(255,255,255,0.028) 1px,
                transparent 2px,
                transparent 4px
            );
        opacity: .24;
        mix-blend-mode: soft-light;
    }

    #newsletterModal .modal-content::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(
            115deg,
            transparent 0%,
            rgba(255,255,255,.05) 16%,
            transparent 33%
        );
        animation: hudSheen 6s linear infinite;
        opacity: .55;
    }

    @keyframes hudSheen {
        0%   { transform: translateX(-120%); }
        100% { transform: translateX(140%); }
    }

    #newsletterModal .modal-header,
    #newsletterModal .modal-footer {
        position: relative;
        z-index: 1;
        border-color: rgba(167, 238, 251, 0.10);
        background: transparent;
    }

    #newsletterModal .modal-header {
        padding: 1rem 1.25rem;
    }

    #newsletterModal .modal-body {
        position: relative;
        z-index: 1;
        padding: 1.1rem 1.25rem 1rem;
    }

    #newsletterModal .modal-footer {
        padding: 1rem 1.25rem 1.2rem;
    }

    #newsletterModal .modal-title {
        display: flex;
        align-items: center;
        gap: .55rem;
        color: var(--hud-neon);
        font-size: 1.06rem;
        font-weight: 700;
        letter-spacing: .2px;
        text-shadow: 0 0 10px rgba(109, 209, 248, 0.18);
    }

    #newsletterModal .btn-close {
        filter: invert(1) brightness(1.35);
        opacity: .85;
        transition: transform .2s ease, opacity .2s ease;
    }

    #newsletterModal .btn-close:hover {
        opacity: 1;
        transform: scale(1.08);
    }

/* ===== Labels / text ===== */
    #newsletterModal .form-label {
        color: var(--hud-text);
        font-weight: 600;
        margin-bottom: .45rem;
    }

    #newsletterModal .form-check-label,
    #newsletterModal .small,
    #newsletterModal .nl-meta {
        color: var(--hud-text-soft);
        line-height: 1.45;
    }

    #newsletterModal a {
        color: var(--hud-neon);
        transition: color .2s ease, opacity .2s ease;
    }

    #newsletterModal a:hover {
        color: #d9fbff;
    }

/* ===== Inputs ===== */
    #newsletterModal .form-control {
        border: 1px solid rgba(167, 238, 251, 0.14);
        background: rgba(255,255,255,0.04);
        color: var(--hud-text);
        border-radius: 4px;
        padding: .82rem .95rem;
        transition: border-color .25s ease, box-shadow .25s ease, background .25s ease;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
    }

    #newsletterModal .form-control::placeholder {
        color: rgba(231, 248, 252, 0.38);
    }

    #newsletterModal .form-control:focus {
        background: rgba(255,255,255,0.06);
        color: #fff;
        border-color: rgba(109, 209, 248, 0.88);
        box-shadow:
            0 0 0 .2rem rgba(109, 209, 248, 0.12),
            0 0 18px rgba(109, 209, 248, 0.10);
    }

    #newsletterModal .form-control-lg {
        min-height: 52px;
    }

/* ===== Checkbox ===== */
    #newsletterModal .form-check-input {
        border-color: rgba(167, 238, 251, 0.35);
        background-color: rgba(255,255,255,0.03);
        box-shadow: none;
    }

    #newsletterModal .form-check-input:checked {
        background-color: var(--hud-neon);
        border-color: var(--hud-neon);
    }

    #newsletterModal .form-check-input:focus {
        border-color: var(--hud-neon-2);
        box-shadow: 0 0 0 .18rem rgba(109, 209, 248, 0.12);
    }

/* ===== Alerts ===== */
    #newsletterModal .alert {
        border-radius: 6px;
        border: 1px solid transparent;
        font-size: .94rem;
        margin-bottom: 1rem;
    }

    #newsletterModal .alert-success {
        background: rgba(34, 197, 94, 0.10);
        border-color: rgba(34, 197, 94, 0.22);
        color: #c8ffd8;
    }

    #newsletterModal .alert-warning {
        background: rgba(250, 204, 21, 0.10);
        border-color: rgba(250, 204, 21, 0.22);
        color: #fff1b2;
    }

    #newsletterModal .alert-danger {
        background: rgba(239, 68, 68, 0.10);
        border-color: rgba(239, 68, 68, 0.22);
        color: #ffd1d1;
    }

/* ===== Submit button premium ===== */
    #newsletterModal .btn-submit-hud {
        min-height: 50px;
        border-radius: 6px;
        font-weight: 800;
        letter-spacing: .25px;
        position: relative;
        overflow: hidden;
    }

    #newsletterModal .btn-submit-hud .btn-glow {
        position: absolute;
        inset: auto 0 0 0;
        height: 2px;
        background: linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent);
        opacity: .9;
    }

/* ===== Card arrows ===== */
    #newsletterModal .card-arrow {
        position: absolute;
        inset: 8px;
        pointer-events: none;
        z-index: 3;
    }

    #newsletterModal .card-arrow-top-left,
    #newsletterModal .card-arrow-top-right,
    #newsletterModal .card-arrow-bottom-left,
    #newsletterModal .card-arrow-bottom-right {
        position: absolute;
        width: 22px;
        height: 22px;
        border-color: rgba(167, 238, 251, 0.62);
        filter: drop-shadow(0 0 6px rgba(109, 209, 248, 0.22));
    }

    #newsletterModal .card-arrow-top-left {
        top: 0;
        left: 0;
        border-top: 2px solid;
        border-left: 2px solid;
    }

    #newsletterModal .card-arrow-top-right {
        top: 0;
        right: 0;
        border-top: 2px solid;
        border-right: 2px solid;
    }

    #newsletterModal .card-arrow-bottom-left {
        bottom: 0;
        left: 0;
        border-bottom: 2px solid;
        border-left: 2px solid;
    }

    #newsletterModal .card-arrow-bottom-right {
        bottom: 0;
        right: 0;
        border-bottom: 2px solid;
        border-right: 2px solid;
    }

/* ===== Backdrop ===== */
    .modal-backdrop.show {
        opacity: .72;
        backdrop-filter: blur(3px);
        -webkit-backdrop-filter: blur(3px);
    }

    @media (max-width: 576px) {
        #newsletterModal .modal-dialog {
            margin: 1rem;
        }

        #newsletterModal .modal-header,
        #newsletterModal .modal-body,
        #newsletterModal .modal-footer {
            padding-left: 1rem;
            padding-right: 1rem;
        }
    }

/* ===== resources\views\components\student-documents-upload.blade.php :: <style> ===== */
:root {
        --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
        --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
        --neon-cyan: #2dd4bf;
        --neon-purple: #a78bfa;
    }

    @keyframes slideInDown {
        from {
            opacity: 0;
            transform: translateY(-20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .doc-upload-card {
        border: 1px solid rgba(45, 212, 191, 0.15);
        border-radius: 12px;
        background: var(--dark-gradient);
        box-shadow: 0 10px 40px rgba(0,0,0,.15);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        animation: slideInDown 0.6s ease-out;
        position: relative;
        overflow: hidden;
    }

    .doc-upload-card::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
    }

    .doc-upload-card:hover {
        border-color: rgba(45, 212, 191, 0.5);
        box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3);
        transform: translateY(-4px);
    }

    .doc-upload-card .card-header,
    .doc-upload-card .card-body {
        position: relative;
        z-index: 2;
    }

    .doc-upload-card .card-header {
        background: transparent;
        border-bottom: 1px solid rgba(45, 212, 191, 0.1);
        color: #fff;
        padding: 1.25rem;
    }

    .doc-upload-card .card-header h5,
    .doc-upload-card .card-header strong {
        color: #fff;
        font-weight: 700;
    }

    .doc-form-item {
        border: 1px solid rgba(45, 212, 191, 0.15);
        border-radius: 8px;
        padding: 1.25rem;
        margin-bottom: 1rem;
        background: rgba(15, 23, 42, 0.4);
        transition: all 0.3s ease;
    }

    .doc-form-item:hover {
        border-color: rgba(45, 212, 191, 0.3);
        background: rgba(45, 212, 191, 0.05);
    }

    .doc-form-item:last-child {
        margin-bottom: 0;
    }

    .form-label {
        font-weight: 600;
        color: rgba(255,255,255,.82);
        margin-bottom: 0.75rem;
    }

    .input-group {
        display: flex;
        gap: 0.5rem;
    }

    .input-group .form-control {
        border-color: rgba(45, 212, 191, 0.2);
        background-color: rgba(15, 23, 42, 0.55);
        color: #e5e7eb;
        border-radius: 6px;
    }

    .input-group .form-control:focus {
        border-color: rgba(45, 212, 191, 0.65);
        box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
        background-color: rgba(15, 23, 42, 0.75);
    }

    .input-group .btn-primary {
        background: linear-gradient(135deg, #2dd4bf, #14b8a6);
        border: none;
        color: #0f172a;
        border-radius: 6px;
        font-weight: 600;
        padding: 0.65rem 1.5rem;
        transition: all 0.3s ease;
    }

    .input-group .btn-primary:hover {
        box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
        transform: translateY(-2px);
    }

    .alert {
        border: 1px solid rgba(59, 130, 246, 0.3);
        background: rgba(59, 130, 246, 0.08);
        color: #93c5fd;
        border-radius: 8px;
        margin-bottom: 1.5rem;
    }

    .alert strong {
        color: #bfdbfe;
    }

/* ===== resources\views\contributions\index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-purple: #a78bfa;
            --hud-gold: #facc15;
        }

        html, body {
            overflow-x: hidden;
        }

        .contrib-page {
            width: 100%;
            overflow-x: hidden;
        }

        .contrib-page .container-fluid {
            padding-left: 10px !important;
            padding-right: 10px !important;
        }

        .contrib-page .row {
            --bs-gutter-x: .75rem;
            --bs-gutter-y: .75rem;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
            transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
        }

        .hud-card:hover {
            transform: translateY(-2px);
            border-color: rgba(45, 212, 191, .45);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .12),
                0 16px 42px rgba(0,0,0,.28);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .contrib-hero {
            padding: 1.35rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .main-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtitle {
            color: var(--hud-muted);
        }

        .hud-stat-card {
            height: 100%;
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .hud-stat-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .hud-kpi-value {
            font-size: 1.45rem;
            font-weight: 900;
            line-height: 1.2;
            color: #fff;
        }

        .hud-stat-icon {
            width: 54px;
            height: 54px;
            border-radius: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 1.35rem;
            flex-shrink: 0;
            background: rgba(45,212,191,.12);
            color: var(--hud-neon);
            border: 1px solid rgba(45,212,191,.22);
        }

        .hud-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .hud-section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .hud-section-title i {
            color: var(--hud-cyan);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            width: 100%;
            min-width: 920px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .hud-actions {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: .45rem;
            flex-wrap: wrap;
        }

        .hud-actions form {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            margin: 0;
        }

        .summary-box {
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .summary-box .label {
            color: rgba(255,255,255,.58);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .summary-box .value {
            color: #fff;
            font-size: 1.35rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .hud-list .list-group-item {
            border-radius: 18px !important;
            margin-bottom: .55rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            color: #fff;
        }

        .hud-badge-amount {
            white-space: nowrap;
            font-weight: 800;
        }

        .payment-panel {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
        }

        .hud-pay-logos img {
            max-height: 68px;
            object-fit: contain;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .hud-unauthorized {
            max-width: 560px;
            margin: 2rem auto 0;
        }

        .progress {
            height: 16px;
            border-radius: 999px;
            background: rgba(255,255,255,.10);
        }

        .progress-bar {
            border-radius: 999px;
            font-weight: 800;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        .text-neon {
            color: var(--hud-cyan) !important;
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dt-buttons {
            display: flex;
            gap: .5rem;
            flex-wrap: wrap;
        }

        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page .hud-toolbar,
        .rtl-page .modal-header,
        .rtl-page .modal-footer {
            flex-direction: row-reverse;
        }

        .rtl-page .ms-1 { margin-left: 0 !important; margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-left: 0 !important; margin-right: .5rem !important; }
        .rtl-page .me-1 { margin-right: 0 !important; margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-right: 0 !important; margin-left: .5rem !important; }

        @media (max-width: 991.98px) {
            .contrib-page .container-fluid {
                padding-left: 6px !important;
                padding-right: 6px !important;
            }

            .hud-toolbar,
            .hud-mobile-stack,
            .hud-mobile-form {
                display: flex !important;
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .hud-mobile-stack .btn,
            .hud-mobile-form .btn,
            .hud-mobile-form .form-select,
            .hud-mobile-form .form-control {
                width: 100%;
            }

            .hud-kpi-value {
                font-size: 1.2rem;
            }

            .hud-pay-logos img {
                max-height: 56px;
                width: 42% !important;
            }

            .hud-table {
                min-width: 860px;
            }
        }

        @media (max-width: 575.98px) {
            .main-title {
                font-size: 1.25rem;
            }

            .hud-kpi-value,
            .summary-box .value {
                font-size: 1.08rem;
            }

            .hud-pay-logos img {
                width: 46% !important;
            }

            .contrib-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\contributions\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-purple: #a78bfa;
            --hud-gold: #facc15;
        }

        html, body {
            overflow-x: hidden;
        }

        .contrib-page {
            width: 100%;
            overflow-x: hidden;
        }

        .contrib-page .container-fluid {
            padding-left: 10px !important;
            padding-right: 10px !important;
        }

        .contrib-page .row {
            --bs-gutter-x: .75rem;
            --bs-gutter-y: .75rem;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
            transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
        }

        .hud-card:hover {
            transform: translateY(-2px);
            border-color: rgba(45, 212, 191, .45);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .12),
                0 16px 42px rgba(0,0,0,.28);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .contrib-hero {
            padding: 1.35rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .main-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtitle {
            color: var(--hud-muted);
        }

        .hud-stat-card {
            height: 100%;
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .hud-stat-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .hud-kpi-value {
            font-size: 1.45rem;
            font-weight: 900;
            line-height: 1.2;
            color: #fff;
        }

        .hud-stat-icon {
            width: 54px;
            height: 54px;
            border-radius: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 1.35rem;
            flex-shrink: 0;
            background: rgba(45,212,191,.12);
            color: var(--hud-neon);
            border: 1px solid rgba(45,212,191,.22);
        }

        .hud-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .hud-section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .hud-section-title i {
            color: var(--hud-cyan);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            width: 100%;
            min-width: 920px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .hud-actions {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: .45rem;
            flex-wrap: wrap;
        }

        .hud-actions form {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            margin: 0;
        }

        .summary-box {
            border-radius: 20px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .summary-box .label {
            color: rgba(255,255,255,.58);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .summary-box .value {
            color: #fff;
            font-size: 1.35rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .hud-list .list-group-item {
            border-radius: 18px !important;
            margin-bottom: .55rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            color: #fff;
        }

        .hud-badge-amount {
            white-space: nowrap;
            font-weight: 800;
        }

        .payment-panel {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
        }

        .hud-pay-logos img {
            max-height: 68px;
            object-fit: contain;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .hud-unauthorized {
            max-width: 560px;
            margin: 2rem auto 0;
        }

        .progress {
            height: 16px;
            border-radius: 999px;
            background: rgba(255,255,255,.10);
        }

        .progress-bar {
            border-radius: 999px;
            font-weight: 800;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        .text-neon {
            color: var(--hud-cyan) !important;
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dt-buttons {
            display: flex;
            gap: .5rem;
            flex-wrap: wrap;
        }

        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page .hud-toolbar,
        .rtl-page .modal-header,
        .rtl-page .modal-footer {
            flex-direction: row-reverse;
        }

        .rtl-page .ms-1 { margin-left: 0 !important; margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-left: 0 !important; margin-right: .5rem !important; }
        .rtl-page .me-1 { margin-right: 0 !important; margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-right: 0 !important; margin-left: .5rem !important; }

        @media (max-width: 991.98px) {
            .contrib-page .container-fluid {
                padding-left: 6px !important;
                padding-right: 6px !important;
            }

            .hud-toolbar,
            .hud-mobile-stack,
            .hud-mobile-form {
                display: flex !important;
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .hud-mobile-stack .btn,
            .hud-mobile-form .btn,
            .hud-mobile-form .form-select,
            .hud-mobile-form .form-control {
                width: 100%;
            }

            .hud-kpi-value {
                font-size: 1.2rem;
            }

            .hud-pay-logos img {
                max-height: 56px;
                width: 42% !important;
            }

            .hud-table {
                min-width: 860px;
            }
        }

        @media (max-width: 575.98px) {
            .main-title {
                font-size: 1.25rem;
            }

            .hud-kpi-value,
            .summary-box .value {
                font-size: 1.08rem;
            }

            .hud-pay-logos img {
                width: 46% !important;
            }

            .contrib-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\contributions\online-user.blade.php :: <style> ===== */
/* === FLIP 3D TARIFS – AVEC GLOW AU SURVOL === */

        .tarif-wrapper {
            perspective: 1200px; /* profondeur 3D */
            position: relative;
        }

        .tarif-card-flip {
            position: relative;
            width: 100%;
            min-height: 220px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        /* Rotation + glow au survol */
        .tarif-wrapper:hover .tarif-card-flip {
            transform: rotateY(180deg);
        }

        .tarif-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.35);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
            transition: box-shadow .4s ease, border-color .4s ease;
        }

        /* Glow vert HUD au survol de la carte */
        .tarif-wrapper:hover .tarif-face {
            border-color: rgba(45, 212, 191, 0.9); /* vert/menthe */
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.65),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        /* FACE AVANT */
        .tarif-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .tarif-front .tarif-count {
            font-size: 2.75rem;
            font-weight: 800;
            letter-spacing: .03em;
        }

        .tarif-front .tarif-label {
            text-transform: uppercase;
            font-size: .8rem;
            letter-spacing: .16em;
            opacity: .8;
        }

        /* FACE ARRIÈRE */
        .tarif-back {
            transform: rotateY(180deg);
        }

        .tarif-back .card-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

/* ===== resources\views\contributions\pdf.blade.php :: <style> ===== */
table {
            width: 100%;
            border-collapse: collapse;
        }
        th, td {
            border: 1px solid black;
            padding: 8px;
            text-align: center;
        }
        th {
            background-color: #f2f2f2;
        }

/* ===== resources\views\contributions\show.blade.php :: <style> ===== */
:root {
            --cot-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --cot-border: rgba(45,212,191,.18);
            --cot-cyan: #2dd4bf;
            --cot-cyan-soft: #a7eefb;
            --cot-purple: #a78bfa;
            --cot-yellow: #fbbf24;
            --cot-muted: rgba(255,255,255,.58);
        }

        .contrib-page {
            color: #fff;
        }

        .contrib-hero,
        .contrib-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--cot-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--cot-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .contrib-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .contrib-hero .card-body,
        .contrib-card .card-body,
        .contrib-card .card-header {
            position: relative;
            z-index: 2;
        }

        .contrib-card {
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .contrib-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.14),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .contrib-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .contrib-title {
            font-size: 1.45rem ;
            font-weight: 600;
            letter-spacing: .2px;
            margin-bottom: .35rem;
        }

        .contrib-avatar {
            width: 86px;
            height: 86px;
            border-radius: 18px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.18);
            flex-shrink: 0;
        }

        .contrib-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(45,212,191,.10);
            color: var(--cot-cyan-soft);
            line-height: 1.2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--cot-cyan-soft);
            flex-shrink: 0;
        }

        .kv-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: .85rem;
        }

        .kv-item {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.46);
            min-width: 0;
        }

        .kv-label {
            font-size: .75rem;
            color: var(--cot-muted);
            margin-bottom: .25rem;
        }

        .kv-value {
            font-weight: 800;
            color: rgba(255,255,255,.92);
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .money-card {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.16);
            background: rgba(15,23,42,.48);
            height: 100%;
        }

        .money-label {
            font-size: .75rem;
            color: var(--cot-muted);
        }

        .money-value {
            font-size: 1.15rem;
            font-weight: 850;
            color: #fff;
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a !important;
            border: none;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--cot-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-dim,
        .text-muted {
            color: var(--cot-muted) !important;
        }

        .progress {
            background: rgba(255,255,255,.08);
            border-radius: 999px;
            overflow: hidden;
        }

        .progress-bar {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
        }

        .row-eq > [class^="col-"],
        .row-eq > [class*=" col-"] {
            display: flex;
        }

        .row-eq > [class^="col-"] > .card,
        .row-eq > [class*=" col-"] > .card {
            width: 100%;
            flex: 1 1 auto;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .contrib-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }

        @media (max-width: 767.98px) {
            .contrib-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .contrib-hero,
            .contrib-card {
                border-radius: 14px !important;
            }

            .contrib-avatar {
                width: 74px;
                height: 74px;
                border-radius: 14px;
            }

            .contrib-actions {
                width: 100%;
                flex-direction: column;
            }

            .contrib-actions .btn,
            .contrib-actions form,
            .contrib-actions button {
                width: 100%;
            }

            .kv-grid {
                grid-template-columns: 1fr;
            }

            .contrib-chip {
                width: 100%;
            }
        }

/* ===== resources\views\contributions\show.blade.php :: @push(css) ===== */

        :root {
            --cot-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --cot-border: rgba(45,212,191,.18);
            --cot-cyan: #2dd4bf;
            --cot-cyan-soft: #a7eefb;
            --cot-purple: #a78bfa;
            --cot-yellow: #fbbf24;
            --cot-muted: rgba(255,255,255,.58);
        }

        .contrib-page {
            color: #fff;
        }

        .contrib-hero,
        .contrib-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--cot-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--cot-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .contrib-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .contrib-hero .card-body,
        .contrib-card .card-body,
        .contrib-card .card-header {
            position: relative;
            z-index: 2;
        }

        .contrib-card {
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .contrib-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.14),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .contrib-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .contrib-title {
            font-size: 1.45rem ;
            font-weight: 600;
            letter-spacing: .2px;
            margin-bottom: .35rem;
        }

        .contrib-avatar {
            width: 86px;
            height: 86px;
            border-radius: 18px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.18);
            flex-shrink: 0;
        }

        .contrib-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(45,212,191,.10);
            color: var(--cot-cyan-soft);
            line-height: 1.2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--cot-cyan-soft);
            flex-shrink: 0;
        }

        .kv-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: .85rem;
        }

        .kv-item {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.46);
            min-width: 0;
        }

        .kv-label {
            font-size: .75rem;
            color: var(--cot-muted);
            margin-bottom: .25rem;
        }

        .kv-value {
            font-weight: 800;
            color: rgba(255,255,255,.92);
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .money-card {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.16);
            background: rgba(15,23,42,.48);
            height: 100%;
        }

        .money-label {
            font-size: .75rem;
            color: var(--cot-muted);
        }

        .money-value {
            font-size: 1.15rem;
            font-weight: 850;
            color: #fff;
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a !important;
            border: none;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--cot-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-dim,
        .text-muted {
            color: var(--cot-muted) !important;
        }

        .progress {
            background: rgba(255,255,255,.08);
            border-radius: 999px;
            overflow: hidden;
        }

        .progress-bar {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
        }

        .row-eq > [class^="col-"],
        .row-eq > [class*=" col-"] {
            display: flex;
        }

        .row-eq > [class^="col-"] > .card,
        .row-eq > [class*=" col-"] > .card {
            width: 100%;
            flex: 1 1 auto;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .contrib-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }

        @media (max-width: 767.98px) {
            .contrib-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .contrib-hero,
            .contrib-card {
                border-radius: 14px !important;
            }

            .contrib-avatar {
                width: 74px;
                height: 74px;
                border-radius: 14px;
            }

            .contrib-actions {
                width: 100%;
                flex-direction: column;
            }

            .contrib-actions .btn,
            .contrib-actions form,
            .contrib-actions button {
                width: 100%;
            }

            .kv-grid {
                grid-template-columns: 1fr;
            }

            .contrib-chip {
                width: 100%;
            }
        }

/* ===== resources\views\contributions_old\index.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
            --hud-red: #ef4444;
        }

        .modal-backdrop {
            background: transparent !important;
            pointer-events: none !important;
        }

        .dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        .contrib-page {
            padding-bottom: 3rem;
        }

        .hud-hero,
        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-hero::before,
        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .hud-hero {
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .hud-title {
            color: var(--hud-text);
            font-size: 1.5rem;
            font-weight: 600;
            margin: 1rem 0 .35rem;
        }

        .hud-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .stat-card {
            position: relative;
            overflow: hidden;
            height: 100%;
            border-radius: 22px;
            padding: 1.25rem;
            background: rgba(15, 23, 42, .78);
            border: 1px solid rgba(45, 212, 191, .18);
            box-shadow: 0 18px 42px rgba(0, 0, 0, .25);
        }

        .stat-label {
            color: var(--hud-muted);
            font-size: .76rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .06em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.55rem;
            font-weight: 900;
            margin-top: .75rem;
        }

        .stat-link {
            color: #a7eefb;
            font-weight: 700;
            text-decoration: none;
        }

        .stat-link:hover {
            color: #fff;
        }

        .stat-icon {
            width: 48px;
            height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            color: #04111f;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            font-size: 1.5rem;
        }

        .hud-card-header {
            position: relative;
            z-index: 2;
            padding: 1.1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
        }

        .hud-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: 0;
        }

        .hud-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .amount-pill {
            display: inline-flex;
            padding: .35rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 400;
        }

        .mode-pill {
            display: inline-flex;
            padding: .3rem .6rem;
            border-radius: 999px;
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            font-weight: 700;
        }

        .dataTables_wrapper .dataTables_length label,
        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(226, 232, 240, .68) !important;
        }

        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select,
        .form-select {
            border-radius: 13px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .summary-list .list-group-item {
            border-radius: 18px;
            margin-bottom: .75rem;
            color: rgba(248, 250, 252, .86);
            background: rgba(15, 23, 42, .72);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .payment-card {
            height: 100%;
            border-radius: 20px;
            background: rgba(15, 23, 42, .70);
            border: 1px solid rgba(148, 163, 184, .16);
            padding: 1rem;
            text-align: center;
        }

        .payment-card img {
            max-height: 90px;
            object-fit: contain;
            border-radius: 14px;
            background: #fff;
            padding: .5rem;
        }

        .access-denied {
            max-width: 520px;
            margin: 4rem auto;
        }

        .alert-modern-success {
            border-radius: 18px;
            color: #d1fae5;
            background: rgba(34, 197, 94, .12);
            border: 1px solid rgba(34, 197, 94, .28);
        }

        .alert-modern-danger {
            border-radius: 18px;
            color: #fecaca;
            background: rgba(239, 68, 68, .12);
            border: 1px solid rgba(239, 68, 68, .28);
        }

        .text-muted {
            color: rgba(226, 232, 240, .62) !important;
        }

        .modal-content {
            border-radius: 22px;
            background: #0f172a;
            color: #f8fafc;
            border: 1px solid rgba(45, 212, 191, .25);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(148, 163, 184, .18);
        }

        @media (max-width: 767.98px) {
            .hud-hero,
            .hud-card-header,
            .hud-card-body {
                padding: 1rem;
            }

            .hud-hero,
            .hud-card {
                border-radius: 22px;
            }
        }

/* ===== resources\views\contributions_old\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
            --hud-red: #ef4444;
        }

        .modal-backdrop {
            background: transparent !important;
            pointer-events: none !important;
        }

        .dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        .contrib-page {
            padding-bottom: 3rem;
        }

        .hud-hero,
        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-hero::before,
        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .hud-hero {
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .hud-title {
            color: var(--hud-text);
            font-size: 1.5rem;
            font-weight: 600;
            margin: 1rem 0 .35rem;
        }

        .hud-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .stat-card {
            position: relative;
            overflow: hidden;
            height: 100%;
            border-radius: 22px;
            padding: 1.25rem;
            background: rgba(15, 23, 42, .78);
            border: 1px solid rgba(45, 212, 191, .18);
            box-shadow: 0 18px 42px rgba(0, 0, 0, .25);
        }

        .stat-label {
            color: var(--hud-muted);
            font-size: .76rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .06em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.55rem;
            font-weight: 900;
            margin-top: .75rem;
        }

        .stat-link {
            color: #a7eefb;
            font-weight: 700;
            text-decoration: none;
        }

        .stat-link:hover {
            color: #fff;
        }

        .stat-icon {
            width: 48px;
            height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            color: #04111f;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            font-size: 1.5rem;
        }

        .hud-card-header {
            position: relative;
            z-index: 2;
            padding: 1.1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
        }

        .hud-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: 0;
        }

        .hud-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .amount-pill {
            display: inline-flex;
            padding: .35rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 400;
        }

        .mode-pill {
            display: inline-flex;
            padding: .3rem .6rem;
            border-radius: 999px;
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            font-weight: 700;
        }

        .dataTables_wrapper .dataTables_length label,
        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(226, 232, 240, .68) !important;
        }

        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select,
        .form-select {
            border-radius: 13px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .summary-list .list-group-item {
            border-radius: 18px;
            margin-bottom: .75rem;
            color: rgba(248, 250, 252, .86);
            background: rgba(15, 23, 42, .72);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .payment-card {
            height: 100%;
            border-radius: 20px;
            background: rgba(15, 23, 42, .70);
            border: 1px solid rgba(148, 163, 184, .16);
            padding: 1rem;
            text-align: center;
        }

        .payment-card img {
            max-height: 90px;
            object-fit: contain;
            border-radius: 14px;
            background: #fff;
            padding: .5rem;
        }

        .access-denied {
            max-width: 520px;
            margin: 4rem auto;
        }

        .alert-modern-success {
            border-radius: 18px;
            color: #d1fae5;
            background: rgba(34, 197, 94, .12);
            border: 1px solid rgba(34, 197, 94, .28);
        }

        .alert-modern-danger {
            border-radius: 18px;
            color: #fecaca;
            background: rgba(239, 68, 68, .12);
            border: 1px solid rgba(239, 68, 68, .28);
        }

        .text-muted {
            color: rgba(226, 232, 240, .62) !important;
        }

        .modal-content {
            border-radius: 22px;
            background: #0f172a;
            color: #f8fafc;
            border: 1px solid rgba(45, 212, 191, .25);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(148, 163, 184, .18);
        }

        @media (max-width: 767.98px) {
            .hud-hero,
            .hud-card-header,
            .hud-card-body {
                padding: 1rem;
            }

            .hud-hero,
            .hud-card {
                border-radius: 22px;
            }
        }

/* ===== resources\views\contributions_old\pdf.blade.php :: <style> ===== */
table {
            width: 100%;
            border-collapse: collapse;
        }
        th, td {
            border: 1px solid black;
            padding: 8px;
            text-align: center;
        }
        th {
            background-color: #f2f2f2;
        }

/* ===== resources\views\contributions_old\show.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
        }

        .contribution-show-page {
            padding: 3rem 0;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .hud-header {
            padding: 2rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            text-align: center;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .hud-title {
            color: var(--hud-text);
            font-size: 1.5rem;
            font-weight: 600;
            margin: 1rem 0 .35rem;
        }

        .hud-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .hud-body {
            padding: 2rem;
        }

        .detail-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 1rem;
        }

        .detail-item {
            padding: 1rem;
            border-radius: 20px;
            background: rgba(15, 23, 42, .68);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .detail-label {
            color: var(--hud-muted);
            font-size: .8rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .06em;
            margin-bottom: .45rem;
        }

        .detail-value {
            color: var(--hud-text);
            font-size: 1.05rem;
            font-weight: 800;
        }

        .amount-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .45rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 900;
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        @media (max-width: 767.98px) {
            .contribution-show-page {
                padding-top: 2rem;
            }

            .hud-header,
            .hud-body {
                padding: 1.25rem;
            }

            .hud-card {
                border-radius: 22px;
            }

            .detail-grid {
                grid-template-columns: 1fr;
            }
        }

/* ===== resources\views\dashboards\index.blade.php :: <style> ===== */
.dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        /* === FLIP 3D LIVRES À TÉLÉCHARGER === */

        .book-flip-wrapper {
            perspective: 1200px;
            position: relative;
        }

        .book-card-flip {
            position: relative;
            width: 100%;
            min-height: 220px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        /* Rotation au survol */
        .book-flip-wrapper:hover .book-card-flip {
            transform: rotateY(180deg);
        }

        .book-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.35);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
            transition: box-shadow .4s ease, border-color .4s ease;
        }

        /* Glow HUD au survol */
        .book-flip-wrapper:hover .book-face {
            border-color: rgba(45, 212, 191, 0.9);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.65),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        /* FACE AVANT */
        .book-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .book-front-icon {
            font-size: 2.8rem;
            opacity: .9;
        }

        .book-front-title {
            font-weight: 700;
            font-size: 1rem;
        }

        .book-front-sub {
            font-size: .8rem;
            text-transform: uppercase;
            letter-spacing: .16em;
            opacity: .75;
        }

        /* FACE ARRIÈRE */
        .book-back {
            transform: rotateY(180deg);
        }

        .book-back .book-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .book-back p {
            font-size: .85rem;
        }

/* ===== resources\views\dashboards\index.blade.php :: <style> ===== */
#chartdiv {
                width: 100%;
                height: 500px;
            }

/* ===== resources\views\dashboards\parent.blade.php :: <style> ===== */
.dt-buttons{display:none!important;visibility:hidden!important;}
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .kid-item{
            display:flex;align-items:center;gap:.75rem;
            padding:.6rem .75rem;border:1px solid rgba(148,163,184,.25);
            border-radius:14px;background:rgba(15,23,42,.55)
        }
        .kid-avatar{
            width:42px;height:48px;object-fit:cover;border-radius:10px;
            border:1px solid rgba(148,163,184,.25)
        }

/* ===== resources\views\dashboards\student.blade.php :: <style> ===== */
.dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        /* Même hauteur des cards par ligne */
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display: flex; }
        .row-eq .card { flex: 1 1 auto; }

        /* === FLIP 3D LIVRES À TÉLÉCHARGER === */

        .book-flip-wrapper {
            perspective: 1200px;
            position: relative;
        }

        .book-card-flip {
            position: relative;
            width: 100%;
            min-height: 220px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        /* Rotation au survol */
        .book-flip-wrapper:hover .book-card-flip {
            transform: rotateY(180deg);
        }

        .book-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.35);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
            transition: box-shadow .4s ease, border-color .4s ease;
        }

        /* Glow HUD au survol */
        .book-flip-wrapper:hover .book-face {
            border-color: rgba(45, 212, 191, 0.9);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.65),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        /* FACE AVANT */
        .book-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .book-front-icon {
            font-size: 2.8rem;
            opacity: .9;
        }

        .book-front-title {
            font-weight: 700;
            font-size: 1rem;
        }

        .book-front-sub {
            font-size: .8rem;
            text-transform: uppercase;
            letter-spacing: .16em;
            opacity: .75;
        }

        /* FACE ARRIÈRE */
        .book-back {
            transform: rotateY(180deg);
        }

        .book-back .book-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .book-back p {
            font-size: .85rem;
        }

/* ===== resources\views\dashboards\student.blade.php :: <style> ===== */
#chartdiv {
                width: 100%;
                height: 500px;
            }

/* ===== resources\views\dashboards\teacher.blade.php :: <style> ===== */
.dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        .row-eq > [class^="col-"],
        .row-eq > [class*=" col-"] {
            display: flex;
        }

        .row-eq .card {
            flex: 1 1 auto;
        }

        /* =========================
           GLOBAL DARK DASHBOARD UI
        ========================= */
        . {
            border: 1px solid rgba(148, 163, 184, .20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
        }

        .::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        . .card-body,
        . .card-header,
        . .card-footer {
            position: relative;
            z-index: 2;
        }

        . .card-header {
            border-bottom: 1px solid rgba(255,255,255,.07);
            background: transparent;
            color: #fff;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            color: #fff;
        }

        .hud-subtext {
            color: rgba(255,255,255,.62);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 4px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(4px);
        }

        .soft-badge.badge-room {
            background: rgba(255,255,255,.04);
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.22);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.22);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.22);
            color: #fecaca;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.22);
            color: #cbd5e1;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 4px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(148,163,184,.18);
            box-shadow: 0 10px 30px rgba(0,0,0,.08);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 4px;
            background: #111827;
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
        }

        .summary-box {
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            padding: 1rem;
            height: 100%;
            position: relative;
            overflow: hidden;
        }

        .summary-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .summary-box > * {
            position: relative;
            z-index: 2;
        }

        .summary-label {
            font-size: .78rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.60);
            font-weight: 700;
            letter-spacing: .05em;
        }

        .summary-value {
            margin-top: .35rem;
            font-size: 1.1rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .summary-link {
            color: #fde68a;
            text-decoration: none;
            font-weight: 600;
        }

        .summary-link:hover {
            color: #fff3b0;
            text-decoration: underline;
        }

        /* =========================
           PROFILE / LOGIN BLOCK
        ========================= */
        .profile-mini {
            display: flex;
            align-items: center;
            gap: 1rem;
        }

        .profile-mini-avatar-wrap {
            width: 60px;
            height: 68px;
            overflow: hidden;
            flex-shrink: 0;
            background: rgba(255,255,255,.06);
            border-radius: 4px;
            border: 1px solid rgba(255,255,255,.10);
        }

        .profile-mini-avatar {
            width: 60px;
            height: 68px;
            object-fit: cover;
        }

        /* =========================
           CLASS CARDS
        ========================= */
        .class-tile {
            display: block;
            height: 100%;
            text-decoration: none;
        }

        .class-tile-card {
            height: 100%;
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
            transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
        }

        .class-tile-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .class-tile-card:hover {
            transform: translateY(-2px);
            border-color: rgba(250,204,21,.35);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 14px 34px rgba(0,0,0,.22);
        }

        .class-tile-card .card-body {
            position: relative;
            z-index: 2;
        }

        .class-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .class-meta {
            color: rgba(255,255,255,.68);
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

        /* =========================
           BOOK FLIP
        ========================= */
        .book-flip-wrapper {
            perspective: 1200px;
            position: relative;
        }

        .book-card-flip {
            position: relative;
            width: 100%;
            min-height: 240px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        .book-flip-wrapper:hover .book-card-flip {
            transform: rotateY(180deg);
        }

        .book-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 4px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background:
                linear-gradient(135deg, rgba(15,23,42,.92), rgba(30,41,59,.82));
            border: 1px solid rgba(148,163,184,.28);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 24px rgba(0,0,0,.45);
            transition: box-shadow .4s ease, border-color .4s ease;
            overflow: hidden;
        }

        .book-face::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .book-face > * {
            position: relative;
            z-index: 2;
        }

        .book-flip-wrapper:hover .book-face {
            border-color: rgba(45, 212, 191, 0.9);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.50),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        .book-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .book-front-icon {
            font-size: 2.8rem;
            color: #fde68a;
            opacity: .95;
        }

        .book-front-title {
            font-weight: 700;
            font-size: 1rem;
            color: #fff;
        }

        .book-front-sub {
            font-size: .8rem;
            text-transform: uppercase;
            letter-spacing: .16em;
            color: rgba(255,255,255,.62);
        }

        .book-back {
            transform: rotateY(180deg);
        }

        .book-back .book-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .book-back h6 {
            color: #fff;
        }

        .book-back p {
            font-size: .85rem;
            color: rgba(255,255,255,.70) !important;
        }

        /* =========================
           KPI CARDS
        ========================= */
        .stat-card {
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
            height: 100%;
        }

        .stat-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .stat-card .card-body {
            position: relative;
            z-index: 2;
        }

        .stat-label {
            color: rgba(255,255,255,.62);
            margin-bottom: 0;
        }

        .stat-value {
            color: #fff;
        }

        .stat-avatar-title {
            width: 52px;
            height: 52px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 4px;
            font-size: 1.5rem;
            border: 1px solid rgba(255,255,255,.10);
        }

        /* =========================
           TABLES DARK
        ========================= */
        .hud-table-card .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table-card .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
        }

        .hud-table-card .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table-scroll {
            max-height: 420px;
            overflow-y: auto;
            overflow-x: auto;
            border-radius: 4px;
        }

        .hud-table-scroll::-webkit-scrollbar {
            width: 10px;
            height: 10px;
        }

        .hud-table-scroll::-webkit-scrollbar-thumb {
            background: rgba(255,255,255,.18);
            border-radius: 10px;
        }

        .hud-table-scroll::-webkit-scrollbar-track {
            background: rgba(255,255,255,.04);
        }

        /* =========================
           ALERTS / EMPTY STATE
        ========================= */
        .hud-empty-state {
            text-align: center;
            padding: 2rem 1rem;
            color: rgba(255,255,255,.78);
        }

        .hud-empty-state img {
            opacity: .9;
        }

        /* =========================
           MOBILE
        ========================= */
        @media (max-width: 991.98px) {
            .profile-mini {
                align-items: flex-start;
                flex-direction: column;
            }

            .profile-mini-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .profile-mini-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .card-body {
                padding: .9rem;
            }

            .,
            .hero-light-card,
            .class-tile-card,
            .book-face,
            .summary-box,
            .stat-card {
                border-radius: 4px;
            }

            .book-card-flip {
                min-height: 250px;
            }
        }

        #chartdiv {
            width: 100%;
            height: 500px;
        }

/* ===== resources\views\devoirs\calendar.blade.php :: <style> ===== */
.fc .fc-toolbar-title{font-size:1.15rem}
        .card-h100{height:100%}
        .calendar-wrap{min-height: 680px}
        .table-wrap{min-height: 680px; overflow:auto}
        .badge-room{font-size:.75rem}

/* ===== resources\views\devoirs\calendar.blade.php :: @push(css) ===== */

        .fc .fc-toolbar-title{font-size:1.15rem}
        .card-h100{height:100%}
        .calendar-wrap{min-height: 680px}
        .table-wrap{min-height: 680px; overflow:auto}
        .badge-room{font-size:.75rem}

/* ===== resources\views\documents\index.blade.php :: <style> ===== */
.dt-buttons { display: none !important; visibility: hidden !important; }

/* ===== resources\views\email_relance.blade.php :: <style> ===== */
body, table, td { font-family: Arial, Helvetica, sans-serif; }
        table { border-collapse: collapse; }
        img { border:0; display:block; }
        .arabic { direction: rtl; text-align: right; font-family: Tahoma, Arial; }

        @media screen and (max-width:640px){
            .container{width:100%!important;}
            .stack{display:block!important;width:100%!important;}
        }

/* ===== resources\views\emails\auto_registration\approved.blade.php :: <style> ===== */
/* Mini reset email */
        body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }
        /* Mobile */
        @media screen and (max-width: 620px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .text-center { text-align:center !important; }
            .btn { width:100% !important; }
        }

/* ===== resources\views\emails\bulk\create.blade.php :: <style> ===== */
:root {
            --mail-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --mail-border: rgba(45,212,191,.18);
            --mail-cyan: #2dd4bf;
            --mail-cyan-soft: #a7eefb;
            --mail-purple: #a78bfa;
            --mail-muted: rgba(255,255,255,.58);
        }

        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        .swal2-container {
            z-index: 20000 !important;
        }

        .mail-page {
            color: #fff;
        }

        .mail-hero {
            border: 1px solid var(--mail-border);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 32%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.16), transparent 36%),
                var(--mail-bg);
            box-shadow: 0 20px 55px rgba(0,0,0,.28);
            overflow: hidden;
            position: relative;
        }

        .mail-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 34px 34px;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent);
            pointer-events: none;
        }

        .mail-hero > * {
            position: relative;
            z-index: 2;
        }

        .mail-title {
            font-size: clamp(1.45rem, 2.5vw, 2.25rem);
            font-weight: 850;
            letter-spacing: .3px;
            margin-bottom: .35rem;
        }

        .mail-subtitle {
            color: var(--mail-muted);
            max-width: 780px;
        }

        .mail-card {
            border: 1px solid var(--mail-border) !important;
            border-radius: 16px !important;
            background: var(--mail-bg) !important;
            box-shadow: 0 14px 42px rgba(0,0,0,.22) !important;
            overflow: hidden;
            position: relative;
        }

        .mail-card .card-header {
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            background: rgba(255,255,255,.025) !important;
            color: #fff;
            padding: 1rem 1.25rem;
            font-weight: 800;
        }

        .mail-card .card-body {
            color: #fff;
            position: relative;
            z-index: 2;
        }

        .mail-card:hover {
            border-color: rgba(45,212,191,.38) !important;
            box-shadow: 0 0 28px rgba(45,212,191,.12), 0 18px 48px rgba(0,0,0,.3) !important;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 700;
        }

        .form-control,
        .form-select,
        textarea,
        select {
            border-color: rgba(45,212,191,.22) !important;
            background-color: rgba(15,23,42,.62) !important;
            color: #e5e7eb !important;
            border-radius: 10px !important;
        }

        .form-control:focus,
        .form-select:focus,
        textarea:focus {
            border-color: rgba(45,212,191,.7) !important;
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.16) !important;
            background-color: rgba(15,23,42,.82) !important;
            color: #fff !important;
        }

        .form-control::placeholder,
        textarea::placeholder {
            color: rgba(255,255,255,.38) !important;
        }

        .form-text,
        .text-muted,
        small.text-muted {
            color: var(--mail-muted) !important;
        }

        .btn {
            border-radius: 10px;
            font-weight: 700;
            letter-spacing: .2px;
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-neon:hover {
            color: #0f172a;
            box-shadow: 0 0 22px rgba(45,212,191,.36);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.35);
            color: var(--mail-cyan-soft);
            background: transparent;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.65);
            color: #fff;
        }

        .stat-pill {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .58rem .8rem;
            border-radius: 999px;
            background: rgba(15,23,42,.65);
            border: 1px solid rgba(45,212,191,.18);
            color: rgba(255,255,255,.82);
            font-size: .82rem;
            font-weight: 700;
        }

        .stat-pill i {
            color: var(--mail-cyan-soft);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45,212,191,.12);
            margin-bottom: 0;
        }

        .table thead th {
            background: rgba(45,212,191,.08);
            color: #f8fafc;
            border-bottom-width: 1px;
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .4px;
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.9);
            vertical-align: middle;
            border-color: rgba(45,212,191,.08);
        }

        .table-hover tbody tr:hover > * {
            background: rgba(45,212,191,.055) !important;
            color: #fff;
        }

        .recipient-avatar {
            height: 42px;
            width: 42px;
            border-radius: 12px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.25);
            background: rgba(15,23,42,.8);
        }

        .recipient-placeholder {
            height: 42px;
            width: 42px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--mail-cyan-soft);
        }

        .badge-soft {
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--mail-cyan-soft);
            border-radius: 999px;
            padding: .45rem .65rem;
        }

        .section-icon {
            width: 36px;
            height: 36px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.22);
            color: var(--mail-cyan-soft);
        }

        .note-editor.note-frame {
            border-color: rgba(45,212,191,.22) !important;
            border-radius: 12px !important;
            overflow: hidden;
            background: rgba(15,23,42,.62);
            color: #fff;
        }

        .note-toolbar {
            background: rgba(15,23,42,.92) !important;
            border-bottom: 1px solid rgba(45,212,191,.14) !important;
        }

        .note-editable {
            background: #fff !important;
            color: #111827 !important;
            min-height: 260px;
        }

        .note-statusbar {
            background: rgba(15,23,42,.92) !important;
            border-top: 1px solid rgba(45,212,191,.14) !important;
        }

        .modal-content {
            border: 1px solid rgba(45,212,191,.22);
            border-radius: 16px;
            background: var(--mail-bg);
            color: #fff;
            box-shadow: 0 24px 65px rgba(0,0,0,.42);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(45,212,191,.12);
        }

        .preview-toolbar {
            background: rgba(15,23,42,.92) !important;
            border-bottom: 1px solid rgba(45,212,191,.14) !important;
        }

        .alert {
            border-radius: 12px;
            border-width: 1px;
        }

        .empty-row {
            color: rgba(255,255,255,.58) !important;
        }

        @media (max-width: 767.98px) {
            .mail-hero {
                border-radius: 14px;
            }

            .mail-card {
                border-radius: 14px !important;
            }

            .table-responsive {
                border-radius: 12px;
            }

            .stat-pill {
                width: 100%;
                justify-content: center;
            }
        }

/* ===== resources\views\emails\bulk\create.blade.php :: @push(css) ===== */

        :root {
            --mail-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --mail-border: rgba(45,212,191,.18);
            --mail-cyan: #2dd4bf;
            --mail-cyan-soft: #a7eefb;
            --mail-purple: #a78bfa;
            --mail-muted: rgba(255,255,255,.58);
        }

        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        .swal2-container {
            z-index: 20000 !important;
        }

        .mail-page {
            color: #fff;
        }

        .mail-hero {
            border: 1px solid var(--mail-border);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 32%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.16), transparent 36%),
                var(--mail-bg);
            box-shadow: 0 20px 55px rgba(0,0,0,.28);
            overflow: hidden;
            position: relative;
        }

        .mail-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 34px 34px;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent);
            pointer-events: none;
        }

        .mail-hero > * {
            position: relative;
            z-index: 2;
        }

        .mail-title {
            font-size: clamp(1.45rem, 2.5vw, 2.25rem);
            font-weight: 850;
            letter-spacing: .3px;
            margin-bottom: .35rem;
        }

        .mail-subtitle {
            color: var(--mail-muted);
            max-width: 780px;
        }

        .mail-card {
            border: 1px solid var(--mail-border) !important;
            border-radius: 16px !important;
            background: var(--mail-bg) !important;
            box-shadow: 0 14px 42px rgba(0,0,0,.22) !important;
            overflow: hidden;
            position: relative;
        }

        .mail-card .card-header {
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            background: rgba(255,255,255,.025) !important;
            color: #fff;
            padding: 1rem 1.25rem;
            font-weight: 800;
        }

        .mail-card .card-body {
            color: #fff;
            position: relative;
            z-index: 2;
        }

        .mail-card:hover {
            border-color: rgba(45,212,191,.38) !important;
            box-shadow: 0 0 28px rgba(45,212,191,.12), 0 18px 48px rgba(0,0,0,.3) !important;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 700;
        }

        .form-control,
        .form-select,
        textarea,
        select {
            border-color: rgba(45,212,191,.22) !important;
            background-color: rgba(15,23,42,.62) !important;
            color: #e5e7eb !important;
            border-radius: 10px !important;
        }

        .form-control:focus,
        .form-select:focus,
        textarea:focus {
            border-color: rgba(45,212,191,.7) !important;
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.16) !important;
            background-color: rgba(15,23,42,.82) !important;
            color: #fff !important;
        }

        .form-control::placeholder,
        textarea::placeholder {
            color: rgba(255,255,255,.38) !important;
        }

        .form-text,
        .text-muted,
        small.text-muted {
            color: var(--mail-muted) !important;
        }

        .btn {
            border-radius: 10px;
            font-weight: 700;
            letter-spacing: .2px;
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-neon:hover {
            color: #0f172a;
            box-shadow: 0 0 22px rgba(45,212,191,.36);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.35);
            color: var(--mail-cyan-soft);
            background: transparent;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.65);
            color: #fff;
        }

        .stat-pill {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .58rem .8rem;
            border-radius: 999px;
            background: rgba(15,23,42,.65);
            border: 1px solid rgba(45,212,191,.18);
            color: rgba(255,255,255,.82);
            font-size: .82rem;
            font-weight: 700;
        }

        .stat-pill i {
            color: var(--mail-cyan-soft);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45,212,191,.12);
            margin-bottom: 0;
        }

        .table thead th {
            background: rgba(45,212,191,.08);
            color: #f8fafc;
            border-bottom-width: 1px;
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .4px;
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.9);
            vertical-align: middle;
            border-color: rgba(45,212,191,.08);
        }

        .table-hover tbody tr:hover > * {
            background: rgba(45,212,191,.055) !important;
            color: #fff;
        }

        .recipient-avatar {
            height: 42px;
            width: 42px;
            border-radius: 12px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.25);
            background: rgba(15,23,42,.8);
        }

        .recipient-placeholder {
            height: 42px;
            width: 42px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--mail-cyan-soft);
        }

        .badge-soft {
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--mail-cyan-soft);
            border-radius: 999px;
            padding: .45rem .65rem;
        }

        .section-icon {
            width: 36px;
            height: 36px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.22);
            color: var(--mail-cyan-soft);
        }

        .note-editor.note-frame {
            border-color: rgba(45,212,191,.22) !important;
            border-radius: 12px !important;
            overflow: hidden;
            background: rgba(15,23,42,.62);
            color: #fff;
        }

        .note-toolbar {
            background: rgba(15,23,42,.92) !important;
            border-bottom: 1px solid rgba(45,212,191,.14) !important;
        }

        .note-editable {
            background: #fff !important;
            color: #111827 !important;
            min-height: 260px;
        }

        .note-statusbar {
            background: rgba(15,23,42,.92) !important;
            border-top: 1px solid rgba(45,212,191,.14) !important;
        }

        .modal-content {
            border: 1px solid rgba(45,212,191,.22);
            border-radius: 16px;
            background: var(--mail-bg);
            color: #fff;
            box-shadow: 0 24px 65px rgba(0,0,0,.42);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(45,212,191,.12);
        }

        .preview-toolbar {
            background: rgba(15,23,42,.92) !important;
            border-bottom: 1px solid rgba(45,212,191,.14) !important;
        }

        .alert {
            border-radius: 12px;
            border-width: 1px;
        }

        .empty-row {
            color: rgba(255,255,255,.58) !important;
        }

        @media (max-width: 767.98px) {
            .mail-hero {
                border-radius: 14px;
            }

            .mail-card {
                border-radius: 14px !important;
            }

            .table-responsive {
                border-radius: 12px;
            }

            .stat-pill {
                width: 100%;
                justify-content: center;
            }
        }

/* ===== resources\views\emails\bulk\index.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Modal z-index management */
        .modal {
            z-index: 2000 !important;
        }

        .modal-backdrop {
            z-index: 1999 !important;
        }

        .modal-backdrop.show {
            z-index: 1999 !important;
        }

        /* Isolate modal from other stacking contexts */
        .modal.fade {
            isolation: isolate;
        }

        /* Support widget should not interfere */
        #supportWidgetModal {
            z-index: 3000 !important;
        }

        #supportWidgetModal ~ .modal-backdrop {
            z-index: 2999 !important;
        }

        .swal2-container {
            z-index: 20000 !important;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        body.swal2-shown {
            padding-right: 0 !important;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.05), rgba(167, 139, 250, 0.05));
            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .hud-card,
        .stats-card,
        .class-tile-card,
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .hud-card::before,
        .stats-card::before,
        .class-tile-card::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.03), rgba(167, 139, 250, 0.03));
            pointer-events: none;
        }

        .hud-card:hover,
        .stats-card:hover,
        .class-tile-card:hover,
        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer,
        .stats-card .card-body,
        .stats-card .card-header,
        .stats-card .card-footer,
        .class-tile-card .card-body,
        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .stats-value {
            margin-top: .6rem;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon,
        .btn-outline-light,
        .btn-outline-secondary,
        .btn-outline-success {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-outline-light:hover,
        .btn-outline-secondary:hover,
        .btn-outline-success:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #22c55e, #16a34a);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(34, 197, 94, 0.4);
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(245, 158, 11, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(245, 158, 11, 0.4);
            color: #f59e0b;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-dark {
            background: linear-gradient(135deg, rgba(31, 41, 55, 0.3), rgba(55, 65, 81, 0.2)) !important;
            border: 1px solid rgba(31, 41, 55, 0.4);
            color: #9ca3af;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
        }

        .soft-badge.badge-room {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.4);
            color: #cbd5e1;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-card .text-muted,
        .stats-card .text-muted,
        .table-hud-wrap .text-muted,
        .card .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .breadcrumb-hud {
            margin-bottom: 1rem;
        }

        .breadcrumb-hud .breadcrumb {
            margin-bottom: 0;
            background: transparent;
            padding: 0;
        }

        .breadcrumb-hud .breadcrumb-item,
        .breadcrumb-hud .breadcrumb-item a {
            color: rgba(255,255,255,.72);
            text-decoration: none;
        }

        .breadcrumb-hud .breadcrumb-item.active {
            color: #2dd4bf;
        }

        .pagination .page-link {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.16);
            color: #2dd4bf;
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.16);
        }

        .action-modal .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .action-modal .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .action-modal .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .action-modal .list-group-item:hover {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .class-tile {
            display: block;
            height: 100%;
            text-decoration: none;
        }

        .class-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .class-meta {
            color: rgba(255,255,255,.68);
        }

        /* Email specific styles */
        .page-title-hud {
            color: #fff;
            font-weight: 800;
            letter-spacing: .3px;
        }

        .text-neon {
            color: #2dd4bf;
        }

        .mail-subject {
            font-weight: 600;
            color: #2dd4bf;
            line-height: 1.3;
        }

        .mail-meta {
            font-size: 12px;
            color: #6dd1f8;
        }

        .status-box {
            min-width: 130px;
        }

        .count-badges .badge {
            font-size: 11px;
            padding: 7px 9px;
            border-radius: 999px;
        }

        .action-btn {
            background: transparent !important;
            border: none !important;
            padding: 0 !important;
            cursor: pointer;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }

        .action-btn i {
            font-size: 15px;
        }

        .action-btn-view {
            color: #0d6efd;
        }

        .action-btn-resend {
            color: #f59f00;
        }

        .action-btn-delete {
            color: #dc3545;
        }

        .action-btn:hover {
            transform: translateY(-1px);
            opacity: .85;
        }

        .mail-row-highlight-scheduled {
            border-left: 4px solid #f0ad4e;
        }

        .mail-row-highlight-sent {
            border-left: 4px solid #198754;
        }

        .mail-row-highlight-pending {
            border-left: 4px solid #6c757d;
        }

        .mini-pill {
            display: inline-block;
            font-size: 11px;
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(248, 249, 250, .08);
            color: #cbd5e1;
            border: 1px solid rgba(255,255,255,.12);
        }

        .table > :not(caption) > * > * {
            vertical-align: middle;
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            border-color: rgba(45, 212, 191, 0.08);
        }

        .card {
            position: relative;
            overflow: hidden;
        }

        .card .card-body {
            position: relative;
            z-index: 2;
        }

        .dataTables_wrapper .dataTables_filter input,
        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select {
            background-color: rgba(15,23,42,.65) !important;
            border-color: rgba(45,212,191,.25) !important;
            color: #fff !important;
        }

        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(255,255,255,.68) !important;
        }

        .pagination .page-link {
            background: rgba(15,23,42,.75);
            border-color: rgba(45,212,191,.18);
            color: #a7eefb;
        }

        .pagination .page-item.active .page-link {
            background: #2dd4bf;
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-item.disabled .page-link {
            background: rgba(15,23,42,.35);
            border-color: rgba(255,255,255,.08);
            color: rgba(255,255,255,.35);
        }

        @media (max-width: 991.98px) {
            .family-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .family-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .page-title-hud {
                font-size: 1.35rem;
            }

            .count-badges {
                gap: .35rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\emails\bulk\index.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Modal z-index management */
        .modal {
            z-index: 2000 !important;
        }

        .modal-backdrop {
            z-index: 1999 !important;
        }

        .modal-backdrop.show {
            z-index: 1999 !important;
        }

        /* Isolate modal from other stacking contexts */
        .modal.fade {
            isolation: isolate;
        }

        /* Support widget should not interfere */
        #supportWidgetModal {
            z-index: 3000 !important;
        }

        #supportWidgetModal ~ .modal-backdrop {
            z-index: 2999 !important;
        }

        .swal2-container {
            z-index: 20000 !important;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        body.swal2-shown {
            padding-right: 0 !important;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.05), rgba(167, 139, 250, 0.05));
            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .hud-card,
        .stats-card,
        .class-tile-card,
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .hud-card::before,
        .stats-card::before,
        .class-tile-card::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.03), rgba(167, 139, 250, 0.03));
            pointer-events: none;
        }

        .hud-card:hover,
        .stats-card:hover,
        .class-tile-card:hover,
        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer,
        .stats-card .card-body,
        .stats-card .card-header,
        .stats-card .card-footer,
        .class-tile-card .card-body,
        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .stats-value {
            margin-top: .6rem;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon,
        .btn-outline-light,
        .btn-outline-secondary,
        .btn-outline-success {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-outline-light:hover,
        .btn-outline-secondary:hover,
        .btn-outline-success:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #22c55e, #16a34a);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(34, 197, 94, 0.4);
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(245, 158, 11, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(245, 158, 11, 0.4);
            color: #f59e0b;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-dark {
            background: linear-gradient(135deg, rgba(31, 41, 55, 0.3), rgba(55, 65, 81, 0.2)) !important;
            border: 1px solid rgba(31, 41, 55, 0.4);
            color: #9ca3af;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
        }

        .soft-badge.badge-room {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.4);
            color: #cbd5e1;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-card .text-muted,
        .stats-card .text-muted,
        .table-hud-wrap .text-muted,
        .card .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .breadcrumb-hud {
            margin-bottom: 1rem;
        }

        .breadcrumb-hud .breadcrumb {
            margin-bottom: 0;
            background: transparent;
            padding: 0;
        }

        .breadcrumb-hud .breadcrumb-item,
        .breadcrumb-hud .breadcrumb-item a {
            color: rgba(255,255,255,.72);
            text-decoration: none;
        }

        .breadcrumb-hud .breadcrumb-item.active {
            color: #2dd4bf;
        }

        .pagination .page-link {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.16);
            color: #2dd4bf;
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.16);
        }

        .action-modal .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .action-modal .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .action-modal .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .action-modal .list-group-item:hover {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .class-tile {
            display: block;
            height: 100%;
            text-decoration: none;
        }

        .class-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .class-meta {
            color: rgba(255,255,255,.68);
        }

        /* Email specific styles */
        .page-title-hud {
            color: #fff;
            font-weight: 800;
            letter-spacing: .3px;
        }

        .text-neon {
            color: #2dd4bf;
        }

        .mail-subject {
            font-weight: 600;
            color: #2dd4bf;
            line-height: 1.3;
        }

        .mail-meta {
            font-size: 12px;
            color: #6dd1f8;
        }

        .status-box {
            min-width: 130px;
        }

        .count-badges .badge {
            font-size: 11px;
            padding: 7px 9px;
            border-radius: 999px;
        }

        .action-btn {
            background: transparent !important;
            border: none !important;
            padding: 0 !important;
            cursor: pointer;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        }

        .action-btn i {
            font-size: 15px;
        }

        .action-btn-view {
            color: #0d6efd;
        }

        .action-btn-resend {
            color: #f59f00;
        }

        .action-btn-delete {
            color: #dc3545;
        }

        .action-btn:hover {
            transform: translateY(-1px);
            opacity: .85;
        }

        .mail-row-highlight-scheduled {
            border-left: 4px solid #f0ad4e;
        }

        .mail-row-highlight-sent {
            border-left: 4px solid #198754;
        }

        .mail-row-highlight-pending {
            border-left: 4px solid #6c757d;
        }

        .mini-pill {
            display: inline-block;
            font-size: 11px;
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(248, 249, 250, .08);
            color: #cbd5e1;
            border: 1px solid rgba(255,255,255,.12);
        }

        .table > :not(caption) > * > * {
            vertical-align: middle;
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            border-color: rgba(45, 212, 191, 0.08);
        }

        .card {
            position: relative;
            overflow: hidden;
        }

        .card .card-body {
            position: relative;
            z-index: 2;
        }

        .dataTables_wrapper .dataTables_filter input,
        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select {
            background-color: rgba(15,23,42,.65) !important;
            border-color: rgba(45,212,191,.25) !important;
            color: #fff !important;
        }

        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(255,255,255,.68) !important;
        }

        .pagination .page-link {
            background: rgba(15,23,42,.75);
            border-color: rgba(45,212,191,.18);
            color: #a7eefb;
        }

        .pagination .page-item.active .page-link {
            background: #2dd4bf;
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-item.disabled .page-link {
            background: rgba(15,23,42,.35);
            border-color: rgba(255,255,255,.08);
            color: rgba(255,255,255,.35);
        }

        @media (max-width: 991.98px) {
            .family-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .family-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .page-title-hud {
                font-size: 1.35rem;
            }

            .count-badges {
                gap: .35rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\emails\bulk\show.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .email-show-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .email-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .email-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .stat-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .stat-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .stat-value {
            color: #fff;
            font-size: 1.25rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .stat-success {
            color: #86efac;
        }

        .stat-danger {
            color: #fecaca;
        }

        .stat-muted {
            color: #cbd5e1;
        }

        .info-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .info-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .info-value {
            color: #fff;
            font-size: 1rem;
            font-weight: 800;
            margin-top: .35rem;
            word-break: break-word;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            white-space: nowrap;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .badge-muted-soft {
            border-color: rgba(148,163,184,.24);
            color: #cbd5e1;
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .email-preview {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgb(39, 49, 54);
            color: #ffffff;
            line-height: 1.6;
            overflow-x: auto;
        }

        .email-preview * {
            max-width: 100%;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .error-cell {
            max-width: 380px;
            white-space: normal;
            word-break: break-word;
            color: #fecaca !important;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .email-topbar,
            .email-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .email-actions .btn,
            .email-actions form,
            .email-actions form button {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .email-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.05rem;
            }
        }

/* ===== resources\views\emails\bulk\show.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .email-show-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .email-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .email-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .stat-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .stat-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .stat-value {
            color: #fff;
            font-size: 1.25rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .stat-success {
            color: #86efac;
        }

        .stat-danger {
            color: #fecaca;
        }

        .stat-muted {
            color: #cbd5e1;
        }

        .info-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .info-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .info-value {
            color: #fff;
            font-size: 1rem;
            font-weight: 800;
            margin-top: .35rem;
            word-break: break-word;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            white-space: nowrap;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .badge-muted-soft {
            border-color: rgba(148,163,184,.24);
            color: #cbd5e1;
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .email-preview {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgb(39, 49, 54);
            color: #ffffff;
            line-height: 1.6;
            overflow-x: auto;
        }

        .email-preview * {
            max-width: 100%;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .error-cell {
            max-width: 380px;
            white-space: normal;
            word-break: break-word;
            color: #fecaca !important;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .email-topbar,
            .email-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .email-actions .btn,
            .email-actions form,
            .email-actions form button {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .email-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.05rem;
            }
        }

/* ===== resources\views\emails\custom.blade.php :: <style> ===== */
body {
            font-family: 'Segoe UI', Roboto, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f6f8fa;
        }
        .container {
            max-width: 600px;
            margin: 30px auto;
            background-color: #ffffff;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
        }
        .header {
            background-color:rgb(15, 98, 106);
            padding: 20px;
            text-align: center;
        }
        .header img {
            max-height: 60px;
        }
        .header h1 {
            color: white;
            margin: 10px 0 0;
            font-size: 22px;
        }
        .content {
            padding: 30px;
            color: #333;
            font-size: 16px;
            line-height: 1.6;
        }
        .content p {
            margin-bottom: 15px;
        }
        .subcontent {
            text-align: center;
            margin: 10px;
        }
        .rotate-10 {
            transform: rotate(10deg);
            transform-origin: center;
        }
        .button {
            display: inline-block;
            padding: 12px 25px;
            margin-top: 20px;
            background-color: rgb(15, 98, 106);
            color: white;
            text-decoration: none;
            border-radius: 4px;
            font-weight: 500;
        }
        .footer {
            background-color: #f0f0f0;
            padding: 15px;
            font-size: 13px;
            text-align: center;
            color: #777;
        }
        .footer a {
            color: #0d6efd;
            text-decoration: none;
        }

/* ===== resources\views\emails\email.blade.php :: <style> ===== */
/* Reset email safe */
        body,table,td,p,a{font-family:Arial,Helvetica,sans-serif;}
        img{border:0;outline:none;text-decoration:none;}
        table{border-collapse:collapse!important;}
        .btn:hover{filter:brightness(0.95);}
        @media (max-width:600px){
            .container{width:100%!important;}
            .px{padding-left:16px!important;padding-right:16px!important;}
        }

/* ===== resources\views\emails\email_abs.blade.php :: <style> ===== */
body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }

        @media screen and (max-width: 640px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .metric-box { display:block !important; width:100% !important; }
            .metric-gap { display:block !important; height:12px !important; }
            .btn { width:100% !important; display:block !important; text-align:center !important; }
            .text-center-mobile { text-align:center !important; }

            td[class="metric-box"] {
                padding-left:0 !important;
                padding-right:0 !important;
            }

            p {
                font-size:16px !important;
            }
        }

/* ===== resources\views\emails\email_connexion.blade.php :: <style> ===== */
body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }

        .arabic {
            direction: rtl;
            text-align: right;
            font-family: Tahoma, Arial, sans-serif;
        }

        @media screen and (max-width: 640px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .metric-box { display:block !important; width:100% !important; }
            .metric-gap { display:block !important; height:12px !important; }
            .btn { width:100% !important; display:block !important; text-align:center !important; }
            .text-center-mobile { text-align:center !important; }

            td[class="metric-box"] {
                padding-left:0 !important;
                padding-right:0 !important;
            }

            p {
                font-size:16px !important;
            }
        }

/* ===== resources\views\emails\email_cot.blade.php :: <style> ===== */
body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }

        .arabic {
            direction: rtl;
            text-align: right;
            font-family: Tahoma, Arial, sans-serif;
        }

        @media screen and (max-width: 640px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .btn { width:100% !important; display:block !important; text-align:center !important; }
            .metric-box { display:block !important; width:100% !important; }
            .text-center-mobile { text-align:center !important; }
            .stack {
                display:block !important;
                width:100% !important;
            }
            .metric-gap {
                display:block !important;
                height:12px !important;
            }

            td[class="metric-box"] {
                padding-left:0 !important;
                padding-right:0 !important;
            }

            .amount-value {
                font-size:28px !important;
            }

            p {
                font-size:16px !important;
            }
        }

/* ===== resources\views\emails\email_identifiant.blade.php :: <style> ===== */
body { margin:0;padding:0;background:#f3f6fb;font-family:Arial,Helvetica,sans-serif;color:#111827; }

        .arabic {
            direction: rtl;
            text-align: right;
            font-family: Tahoma, Arial, sans-serif;
        }

        @media screen and (max-width:640px){
            .container{width:100%!important;}
            .px{padding-left:16px!important;padding-right:16px!important;}
        }

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
#outlook a { padding:0; }
        body { margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; }
        table, td { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }
        img { border:0;height:auto;line-height:100%; outline:none;text-decoration:none;-ms-interpolation-mode:bicubic; }
        p { display:block;margin:13px 0; }

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
.outlook-group-fix { width:100% !important; }

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);
        @import url(https://fonts.googleapis.com/css?family=Oswald:400,700);

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
@media only screen and (max-width:480px) {
            .mj-column-per-50 { width:50% !important; max-width: 50%; }
            .mj-column-per-25 { width:25% !important; max-width: 25%; }
            .mj-column-per-75 { width:75% !important; max-width: 75%; }
            .mj-column-per-100 { width:100% !important; max-width: 100%; }
            .mj-column-per-33 { width:33.333333333333336% !important; max-width: 33.333333333333336%; }
        }

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
@media only screen and (max-width:480px) {
            table.full-width-mobile { width: 100% !important; }
            td.full-width-mobile { width: auto !important; }
        }

/* ===== resources\views\emails\email_reinscript.blade.php :: <style> ===== */
.hide_on_mobile { display: none !important;}
        @media only screen and (min-width: 480px) { .hide_on_mobile { display: block !important;} }
        .hide_section_on_mobile { display: none !important;}
        @media only screen and (min-width: 480px) {
            .hide_section_on_mobile {
                display: table !important;
            }

            div.hide_section_on_mobile {
                display: block !important;
            }
        }
        .hide_on_desktop { display: block !important;}
        @media only screen and (min-width: 480px) { .hide_on_desktop { display: none !important;} }
        .hide_section_on_desktop { display: table !important;}
        @media only screen and (min-width: 480px) { .hide_section_on_desktop { display: none !important;} }

        p, h1, h2, h3 {
            margin: 0px;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        @media only screen and (max-width:480px) {

            .mj-column-per-100 { width:100%!important; max-width:100%!important; }
            .mj-column-per-100 > .mj-column-per-75 { width:75%!important; max-width:75%!important; }
            .mj-column-per-100 > .mj-column-per-60 { width:60%!important; max-width:60%!important; }
            .mj-column-per-100 > .mj-column-per-50 { width:50%!important; max-width:50%!important; }
            .mj-column-per-100 > .mj-column-per-40 { width:40%!important; max-width:40%!important; }
            .mj-column-per-100 > .mj-column-per-33 { width:33.333333%!important; max-width:33.333333%!important; }
            .mj-column-per-100 > .mj-column-per-25 { width:25%!important; max-width:25%!important; }

            .mj-column-per-100 { width:100%!important; max-width:100%!important; }
            .mj-column-per-75 { width:100%!important; max-width:100%!important; }
            .mj-column-per-60 { width:100%!important; max-width:100%!important; }
            .mj-column-per-50 { width:100%!important; max-width:100%!important; }
            .mj-column-per-40 { width:100%!important; max-width:100%!important; }
            .mj-column-per-33 { width:100%!important; max-width:100%!important; }
            .mj-column-per-25 { width:100%!important; max-width:100%!important; }
        }

/* ===== resources\views\emails\layouts\message-card.blade.php :: <style> ===== */
body {
            margin: 0 !important;
            padding: 0 !important;
            background-color: #f5f6fa !important;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            color: #1a1a1a;
        }
        img {
            border: 0;
            line-height: 100%;
            vertical-align: middle;
            max-width: 100%;
            height: auto;
        }
        a {
            text-decoration: none;
            color: #0d6efd;
        }
        .wrapper {
            width: 100%;
            background-color: #f5f6fa;
            padding: 24px 12px;
        }
        .card {
            max-width: 480px;
            margin: 0 auto;
            background-color: #ffffff;
            border-radius: 12px;
            border: 1px solid #e5e7eb;
            overflow: hidden;
            box-shadow: 0 20px 50px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.06);
        }
        .card-header {
            background: linear-gradient(90deg,#4f46e5 0%,#6366f1 50%,#818cf8 100%);
            color: #fff;
            padding: 20px 24px;
            text-align: left;
        }
        .app-name {
            font-size: 14px;
            font-weight: 600;
            letter-spacing: -0.03em;
            opacity: .9;
            margin: 0 0 4px;
        }
        .card-title {
            font-size: 16px;
            font-weight: 600;
            line-height: 1.4;
            margin: 0;
        }
        .card-body {
            padding: 24px;
            font-size: 15px;
            line-height: 1.6;
            color: #1f2937;
            background-color: #ffffff;
        }
        .hello {
            font-weight: 600;
            font-size: 15px;
            color: #111827;
            margin: 0 0 8px;
        }
        .card-footer {
            padding: 20px 24px;
            background-color: #ffffff;
            border-top: 1px solid #e5e7eb;
            text-align: left;
        }
        .footer-text {
            font-size: 12px;
            line-height: 1.5;
            color: #9ca3af;
            margin: 0;
        }
        .footer-brand {
            font-size: 12px;
            font-weight: 600;
            color: #4b5563;
            margin: 12px 0 0;
        }
        .content p {
            margin: 0 0 12px;
        }
        .content ul,
        .content ol {
            margin: 0 0 12px 18px;
            padding: 0;
        }
        .content li {
            margin: 0 0 6px;
        }
        .content h1,
        .content h2,
        .content h3 {
            margin: 16px 0 10px;
            line-height: 1.25;
        }
        .content a {
            color: #0d6efd;
        }
        .content img {
            max-width: 100%;
            height: auto;
            border-radius: 8px;
        }
        .info-box {
            background: #f9fafb;
            border: 1px solid #e5e7eb;
            border-radius: 8px;
            padding: 14px 16px;
            margin: 16px 0;
        }
        .message-box {
            font-size: 15px;
            line-height: 1.7;
            background: #f9fafb;
            border-left: 4px solid #6366f1;
            padding: 14px 16px;
            margin: 0 0 20px 0;
            color: #374151;
            white-space: pre-line;
        }

        @media (max-width: 480px) {
            .card {
                border-radius: 10px;
            }
            .card-header,
            .card-body,
            .card-footer {
                padding-left: 16px;
                padding-right: 16px;
            }
            .card-title {
                font-size: 15px;
            }
        }

/* ===== resources\views\emails\preinscription_confirm.blade.php :: <style> ===== */
body{margin:0;background:#f6f8fb;font-family:Arial,Helvetica,sans-serif;color:#111827;}
        .wrap{padding:18px;}
        .card{max-width:640px;margin:0 auto;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 6px 24px rgba(0,0,0,.08)}
        .head{background:#97b4e0;color:#fff;padding:22px 22px}
        .head h1{margin:0;font-size:20px;line-height:1.2}
        .head p{margin:6px 0 0;font-size:14px;opacity:.95}
        .content{padding:22px}
        .box{border:1px solid #e5e7eb;border-radius:12px;padding:14px;background:#f9fafb}
        .btn{display:inline-block;background:#2563eb;color:#fff !important;text-decoration:none;padding:12px 16px;border-radius:10px;font-weight:700}
        .muted{color:#6b7280;font-size:13px;line-height:1.5}
        .table{width:100%;border-collapse:collapse;margin-top:10px}
        .table th,.table td{border-bottom:1px solid #e5e7eb;padding:10px 8px;text-align:left;font-size:14px}
        .badge{display:inline-block;background:#eef2ff;color:#3730a3;padding:3px 8px;border-radius:999px;font-size:12px;font-weight:700}
        .footer{padding:18px 22px;background:#0b1220;color:#cbd5e1}
        .footer a{color:#cbd5e1;text-decoration:underline}
        @media (max-width: 600px){
            .wrap{padding:10px}
            .head{padding:18px}
            .content{padding:16px}
            .btn{display:block;text-align:center}
            .table th,.table td{font-size:13px;padding:8px 6px}
        }

/* ===== resources\views\emails\templates\bulk.blade.php :: <style> ===== */
body {
            margin: 0 !important;
            padding: 0 !important;
            background-color: #f5f6fa !important;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            color: #1a1a1a;
        }
        img {
            border: 0;
            line-height: 100%;
            vertical-align: middle;
            max-width: 100%;
            height: auto;
        }
        a { text-decoration: none; color: #0d6efd; }
        .wrapper { width: 100%; background-color: #f5f6fa; padding: 24px 12px; }
        .card {
            max-width: 480px;
            margin: 0 auto;
            background-color: #ffffff;
            border-radius: 12px;
            border: 1px solid #e5e7eb;
            overflow: hidden;
            box-shadow: 0 20px 50px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.06);
        }
        .card-header {
            background: linear-gradient(90deg,#4f46e5 0%,#6366f1 50%,#818cf8 100%);
            color: #fff;
            padding: 20px 24px;
            text-align: left;
        }
        .app-name {
            font-size: 14px;
            font-weight: 600;
            letter-spacing: -0.03em;
            opacity: .9;
            margin: 0 0 4px;
        }
        .card-title {
            font-size: 16px;
            font-weight: 600;
            line-height: 1.4;
            margin: 0;
        }
        .card-body {
            padding: 24px;
            font-size: 15px;
            line-height: 1.5;
            color: #1f2937;
            background-color: #ffffff;
        }
        .hello {
            font-weight: 600;
            font-size: 15px;
            color: #111827;
            margin: 0 0 8px;
        }
        .card-footer {
            padding: 20px 24px;
            background-color: #ffffff;
            border-top: 1px solid #e5e7eb;
            text-align: left;
        }
        .footer-text {
            font-size: 12px;
            line-height: 1.5;
            color: #9ca3af;
            margin: 0;
        }
        .footer-brand {
            font-size: 12px;
            font-weight: 600;
            color: #4b5563;
            margin: 12px 0 0;
        }

        /* Améliore un peu le rendu des contenus Summernote */
        .content p { margin: 0 0 12px; }
        .content ul, .content ol { margin: 0 0 12px 18px; padding: 0; }
        .content li { margin: 0 0 6px; }
        .content h1, .content h2, .content h3 { margin: 16px 0 10px; line-height: 1.25; }
        .content a { color: #0d6efd; }
        .content img { max-width: 100%; height: auto; border-radius: 8px; }

        @media (max-width: 480px) {
            .card { border-radius: 10px; }
            .card-header, .card-body, .card-footer {
                padding-left: 16px;
                padding-right: 16px;
            }
            .card-title { font-size: 15px; }
        }

/* ===== resources\views\emails\templates\bulk_preview.blade.php :: <style> ===== */
body{margin:0;background:#f5f6fa;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:#111827;}
        img{max-width:100%;height:auto;border:0;vertical-align:middle;}
        a{color:#0d6efd;text-decoration:none;}
        .wrap{padding:24px 12px;}
        .card{max-width:600px;margin:0 auto;background:#fff;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;}
        .head{background:linear-gradient(90deg,#4f46e5 0%,#6366f1 50%,#818cf8 100%);color:#fff;padding:18px 22px;}
        .head small{opacity:.9;font-weight:600;display:block;margin-bottom:4px}
        .head h1{margin:0;font-size:16px;line-height:1.35;font-weight:700;}
        .body{padding:22px;font-size:15px;line-height:1.55;color:#374151;}
        .content p{margin:0 0 12px;}
        .content ul,.content ol{margin:0 0 12px 18px;padding:0;}
        .content img{border-radius:10px;}
        .foot{padding:18px 22px;border-top:1px solid #e5e7eb;color:#9ca3af;font-size:12px;line-height:1.45}

/* ===== resources\views\emails\users\identifiers.blade.php :: <style> ===== */
body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }

        .arabic {
            direction: rtl;
            text-align: right;
            font-family: Tahoma, Arial, sans-serif;
        }

        @media screen and (max-width: 640px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .metric-box { display:block !important; width:100% !important; }
            .metric-gap { display:block !important; height:12px !important; }
            .btn { width:100% !important; display:block !important; text-align:center !important; }
            .text-center-mobile { text-align:center !important; }

            td[class="metric-box"] {
                padding-left:0 !important;
                padding-right:0 !important;
            }

            p {
                font-size:16px !important;
            }
        }

/* ===== resources\views\events\edit.blade.php :: <style> ===== */
.hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }
        .text-dim { color: rgba(255,255,255,.65); }
        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .form-hint { font-size: .85rem; color: rgba(255,255,255,.55); }
        .pill{
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            border-radius: 999px;
            padding: .35rem .6rem;
            display: inline-flex;
            align-items: center;
            gap: .4rem;
        }

        /* petit polish HUD */
        .form-control, .form-select {
            background-color: rgba(255,255,255,.04);
            border-color: rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .form-control:focus, .form-select:focus {
            border-color: rgba(0,208,132,.55);
            box-shadow: 0 0 0 .15rem rgba(0,208,132,.15);
        }
        .form-control::placeholder { color: rgba(255,255,255,.45); }

/* ===== resources\views\events\edit.blade.php :: @push(css) ===== */

        .hero{
            background: rgba(255,255,255,.04);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 16px;
        }
        .text-dim { color: rgba(255,255,255,.65); }
        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .form-hint { font-size: .85rem; color: rgba(255,255,255,.55); }
        .pill{
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            border-radius: 999px;
            padding: .35rem .6rem;
            display: inline-flex;
            align-items: center;
            gap: .4rem;
        }

        /* petit polish HUD */
        .form-control, .form-select {
            background-color: rgba(255,255,255,.04);
            border-color: rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
        }
        .form-control:focus, .form-select:focus {
            border-color: rgba(0,208,132,.55);
            box-shadow: 0 0 0 .15rem rgba(0,208,132,.15);
        }
        .form-control::placeholder { color: rgba(255,255,255,.45); }

/* ===== resources\views\events\index.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #a7eefb;
            --neon-purple: #a78bfa;
            --neon-yellow: #fbbf24;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            --bs-body-font-weight: 500;
        }

        @keyframes slideInDown {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        @keyframes glow-pulse {
            0%, 100% { box-shadow: 0 0 5px rgba(45, 212, 191, 0.3); }
            50% { box-shadow: 0 0 20px rgba(45, 212, 191, 0.6); }
        }

        .modal-backdrop { background: transparent !important; pointer-events: none !important; }

        #calendar {
            height: 100%;
            min-height: 500px;
            max-height: 600px;
            overflow-y: auto;
        }

        .dt-buttons, .dt-length {
            display:none !important;
            visibility:hidden !important;
        }

        .table {
            font-size: 14px !important;
            font-weight: 300 !important;t;
        }

/* ===== AVATARS ===== */
        .modal-user-avatar,
        .avatar-cell img,
        .event-avatar {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(45, 212, 191, 0.3);
            transition: var(--transition-smooth);
        }

        .event-avatar:hover {
            border-color: rgba(45, 212, 191, 0.8);
            box-shadow: 0 0 12px rgba(45, 212, 191, 0.4);
            transform: scale(1.1);
        }

        /* =========================
           GLOBAL HUD STYLE
        ========================= */
        .hud-card {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 40px rgba(0,0,0,.25);
            position: relative;
            overflow: hidden;
            transition: var(--transition-smooth);
            animation: fadeIn 0.6s ease-out;
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3);
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer {
            position: relative;
            z-index: 2;
        }

        .hud-card .card-header {
            border-bottom: 1px solid rgba(45, 212, 191, 0.15);
            background: transparent;
            color: #fff;
            padding: 1.25rem !important;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: slideInDown 0.6s ease-out;
        }

        .hud-subtext {
            color: rgba(255,255,255,.62);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .5rem .8rem;
            border-radius: 8px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(8px);
            transition: var(--transition-smooth);
            animation: fadeInUp 0.6s ease-out;
        }

        .soft-badge:hover {
            border-color: rgba(45, 212, 191, 0.4);
            background: rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .soft-badge.badge-room {
            background: rgba(250,204,21,.08);
            border-color: rgba(250,204,21,.3);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.3);
            background: rgba(59,130,246,.08);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.3);
            background: rgba(34,197,94,.08);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.3);
            background: rgba(239,68,68,.08);
            color: #fecaca;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.22);
            color: #cbd5e1;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 12px;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.15), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(45, 212, 191, 0.3);
            box-shadow: 0 10px 40px rgba(0,0,0,.12);
            transition: var(--transition-smooth);
            animation: fadeInUp 0.6s ease-out;
        }

        .hero-light-card:hover {
            border-color: rgba(45, 212, 191, 0.6);
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.25), 0 15px 40px rgba(0,0,0,.15);
            transform: translateY(-4px);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .55rem .9rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(167, 139, 250, 0.2));
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
            border: 1px solid rgba(45, 212, 191, 0.3);
            transition: var(--transition-smooth);
            animation: slideInDown 0.6s ease-out;
        }

        .hero-chip:hover {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.3), rgba(167, 139, 250, 0.3));
            border-color: rgba(45, 212, 191, 0.6);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.3);
            transform: translateY(-2px);
        }

        .text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

/* ===== BOÎTES SOMMAIRES ===== */
        .summary-box {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 40px rgba(0,0,0,.25);
            padding: 1.25rem;
            height: 100%;
            position: relative;
            overflow: hidden;
            transition: var(--transition-smooth);
            animation: fadeInUp 0.6s ease-out;
        }

        .summary-box:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3);
            transform: translateY(-4px);
        }

        .summary-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .summary-box > * {
            position: relative;
            z-index: 2;
        }

        .summary-label {
            font-size: .78rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.60);
            font-weight: 700;
            letter-spacing: .05em;
        }

        .summary-value {
            margin-top: .35rem;
            font-size: 1.12rem;
            font-weight: 800;
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            line-height: 1.2;
        }

        .summary-mini {
            color: rgba(255,255,255,.72);
            font-size: .84rem;
        }

/* ===== TABLEAUX ===== */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.1);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 2px;
            border-bottom-color: rgba(45, 212, 191, 0.2) !important;
            background: rgba(45, 212, 191, 0.05);
            vertical-align: middle;
            white-space: nowrap;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            transition: var(--transition-smooth);
        }

        .table-hud-wrap .table tbody tr {
            transition: var(--transition-smooth);
            border-bottom-color: rgba(45, 212, 191, 0.08) !important;
        }

        .table-hud-wrap .table tbody tr:hover {
            background-color: rgba(45, 212, 191, 0.08) !important;
            box-shadow: inset 0 0 15px rgba(45, 212, 191, 0.05);
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .table-hud-wrap .table a {
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
            text-decoration: none;
        }

        .table-hud-wrap .table a:hover {
            color: var(--neon-purple);
            text-shadow: 0 0 10px rgba(45, 212, 191, 0.4);
            transform: translateY(-1px);
        }

        .table-hud-wrap .text-muted,
        .hud-card .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

/* ===== LÉGENDE CALENDRIER ===== */
        .calendar-legend {
            display: flex;
            flex-wrap: wrap;
            gap: 1rem;
            align-items: center;
        }

        .calendar-legend-item {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            color: rgba(255,255,255,.82);
            font-size: .82rem;
        }

        .calendar-legend-dot {
            display: inline-block;
            width: 12px;
            height: 12px;
            border-radius: 999px;
            animation: glow-pulse 2s ease-in-out infinite;
        }

/* ===== ACTIONS ===== */
        .action-inline {
            display: flex;
            justify-content: center;
            gap: .75rem;
            align-items: center;
        }

/* ===== MODALES ===== */
        .hud-modal .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow: 0 20px 60px rgba(0,0,0,.3);
            animation: fadeInUp 0.4s ease-out;
        }

        .hud-modal .modal-header {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.1));
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.15);
            border-radius: 12px 12px 0 0;
            padding: 1.25rem !important;
        }

        .hud-modal .modal-header .modal-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .hud-modal .modal-body {
            background: transparent;
            padding: 1.5rem !important;
        }

        .hud-modal .modal-footer {
            background: transparent;
            border-top: 1px solid rgba(45, 212, 191, 0.1);
            padding: 1.25rem !important;
        }

        .hud-avatar-box {
            display: flex;
            align-items: center;
            gap: .75rem;
            padding: 1rem;
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 8px;
            background: rgba(45, 212, 191, 0.05);
            transition: var(--transition-smooth);
        }

        .hud-avatar-box:hover {
            border-color: rgba(45, 212, 191, 0.4);
            background: rgba(45, 212, 191, 0.08);
        }

        .hud-avatar-box img {
            width: 80px;
            height: 80px;
            object-fit: cover;
            border-radius: 8px;
            border: 2px solid rgba(45, 212, 191, 0.3);
        }

        .hud-avatar-box .fw-semibold {
            color: #fff;
            font-size: 1rem;
        }

        .hud-avatar-box .text-muted {
            color: rgba(255, 255, 255, 0.6) !important;
        }

/* ===== ALERTES ===== */
        .alert {
            border-radius: 8px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
            animation: slideInDown 0.4s ease-out;
        }

        .alert-success {
            background: rgba(16, 185, 129, 0.05) !important;
            border-color: rgba(16, 185, 129, 0.2) !important;
            color: #bbf7d0 !important;
        }

        .alert-danger {
            background: rgba(239, 68, 68, 0.05) !important;
            border-color: rgba(239, 68, 68, 0.2) !important;
            color: #fecaca !important;
        }

        .alert-success .btn-close,
        .alert-danger .btn-close {
            filter: invert(1);
        }

/* ===== LIENS ET ICÔNES ===== */
        a {
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
        }

        a:hover {
            color: var(--neon-purple);
        }

        .fs-5 {
            transition: var(--transition-smooth);
        }

        a .fs-5:hover {
            transform: scale(1.15);
        }

        @media (max-width: 991.98px) {
            .events-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .events-topbar .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .card-body {
                padding: .9rem;
            }

            .hud-card,
            .hero-light-card,
            .summary-box {
                border-radius: 12px;
            }
        }

/* ===== BOUTONS ===== */
        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: var(--transition-smooth);
            padding: 0.65rem 1.5rem;
        }

        .btn-sm {
            padding: .45rem .7rem;
            font-size: .85rem;
        }

        .btn-info {
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            border-color: rgba(45, 212, 191, 0.4);
            color: #0f172a;
            font-weight: 600;
        }

        .btn-info:hover {
            border-color: rgba(45, 212, 191, 0.7);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            border-color: rgba(16, 185, 129, 0.4);
            color: #fff;
            font-weight: 600;
        }

        .btn-success:hover {
            border-color: rgba(16, 185, 129, 0.7);
            box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-success {
            border-color: rgba(16, 185, 129, 0.4);
            color: #10b981;
        }

        .btn-outline-success:hover {
            background: rgba(16, 185, 129, 0.1);
            border-color: rgba(16, 185, 129, 0.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: var(--neon-cyan);
            background: transparent;
        }

        .btn-outline-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

/* ===== COULEURS NEON ===== */
        .btn-outline-neon {
            border-color: var(--neon-cyan);
            color: var(--neon-cyan);
            background: transparent;
        }

        .btn-outline-neon:hover {
            border-color: var(--neon-purple);
            color: #fff;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(167, 139, 250, 0.2));
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.3);
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: var(--neon-cyan);
            background-color: rgba(45, 212, 191, 0.2);
            color: var(--neon-cyan);
        }

        .btn-neon:hover {
            border-color: var(--neon-purple);
            color: #fff;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.3), rgba(167, 139, 250, 0.3));
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

/* ===== CARTES HERO ===== */
        .hero-info {
            border: 1px solid rgba(45, 212, 191, 0.2) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: var(--transition-smooth);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .hero-info::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
            z-index: 1;
        }

        .hero-info > * {
            position: relative;
            z-index: 2;
        }

        .hero-info:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .hero-info .card-header,
        .hero-info .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hero-info .card-body {
            padding: 1.5rem !important;
        }

/* ===== resources\views\events\index.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #a7eefb;
            --neon-purple: #a78bfa;
            --neon-yellow: #fbbf24;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            --bs-body-font-weight: 500;
        }

        @keyframes slideInDown {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        @keyframes glow-pulse {
            0%, 100% { box-shadow: 0 0 5px rgba(45, 212, 191, 0.3); }
            50% { box-shadow: 0 0 20px rgba(45, 212, 191, 0.6); }
        }

        .modal-backdrop { background: transparent !important; pointer-events: none !important; }

        #calendar {
            height: 100%;
            min-height: 500px;
            max-height: 600px;
            overflow-y: auto;
        }

        .dt-buttons, .dt-length {
            display:none !important;
            visibility:hidden !important;
        }

        .table {
            font-size: 14px !important;
            font-weight: 300 !important;t;
        }

/* ===== resources\views\events\show.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
        }

        .events-show-page { position: relative; }

        .event-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 20px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 30%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .event-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-dim { color: var(--hud-muted) !important; }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .teacher-avatar {
            width: 92px;
            height: 92px;
            border-radius: 22px;
            object-fit: cover;
            border: 1px solid rgba(167, 238, 251, .28);
            background: rgba(255, 255, 255, .06);
            box-shadow: 0 0 25px rgba(45, 212, 191, .18);
        }

        .badge-soft {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .7rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .18);
            font-size: .78rem;
            font-weight: 700;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, .72) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .24),
                0 0 22px rgba(45, 212, 191, .22),
                0 18px 42px rgba(0, 0, 0, .42) !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .row-eq > [class^="col-"],
        .row-eq > [class*=" col-"] {
            display: flex;
        }

        .row-eq .card { flex: 1 1 auto; }

        .switch { min-width: 300px; }

        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .nav-tabs {
            border-bottom: 1px solid var(--hud-line);
            gap: .35rem;
        }

        .nav-tabs .nav-link {
            border: 1px solid transparent;
            color: var(--hud-muted);
            border-radius: 999px;
            padding: .55rem .85rem;
        }

        .nav-tabs .nav-link:hover {
            border-color: rgba(167, 238, 251, .22);
            color: var(--hud-blue);
        }

        .nav-tabs .nav-link.active {
            color: #49d9ec;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            border-color: transparent;
            font-weight: 800;
        }

        .kv dt {
            color: var(--hud-muted);
            font-weight: 600;
        }

        .kv dd {
            margin-bottom: .45rem;
            color: var(--hud-text);
        }

        .details-title {
            display: flex;
            align-items: center;
            gap: .35rem;
        }

        .absence-details-header { gap: .75rem; }

        .modal-content {
            border: 1px solid var(--hud-line);
            background: rgba(15, 23, 42, .98);
            color: var(--hud-text);
            border-radius: 18px;
        }

        .modal-header,
        .modal-footer {
            border-color: var(--hud-line);
        }

        html[dir="rtl"] .details-title {
            flex-direction: row-reverse;
            justify-content: flex-start;
            text-align: right;
        }

        html[dir="rtl"] .absence-details-header {
            flex-direction: row-reverse;
        }

        html[dir="rtl"] .card-header .small.text-dim {
            text-align: left;
        }

        html[dir="rtl"] .nav-tabs {
            flex-direction: row-reverse;
        }

        html[dir="rtl"] .nav-tabs .nav-link i {
            margin-left: .25rem !important;
            margin-right: 0 !important;
        }

        html[dir="rtl"] .kv dt { text-align: right; }
        html[dir="rtl"] .kv dd { text-align: left; }
        html[dir="rtl"] .event-hero .text-dim { text-align: right; }

        html[dir="rtl"] .form-label,
        html[dir="rtl"] .form-select,
        html[dir="rtl"] .btn,
        html[dir="rtl"] .alert,
        html[dir="rtl"] .card-body,
        html[dir="rtl"] .card-header {
            text-align: right;
        }

        html[dir="rtl"] .form-select { direction: rtl; }

        @media (max-width: 768px) {
            .event-hero { padding: 1rem; }
            .switch { min-width: 100%; }

            .teacher-avatar {
                width: 78px;
                height: 78px;
            }

            html[dir="rtl"] .absence-details-header {
                flex-direction: column;
                align-items: flex-start !important;
            }

            html[dir="rtl"] .card-header .small.text-dim {
                width: 100%;
                text-align: right;
            }

            html[dir="rtl"] .nav-tabs .nav-item {
                flex: 1 1 auto;
            }

            html[dir="rtl"] .nav-tabs .nav-link {
                width: 100%;
                font-size: .9rem;
                white-space: nowrap;
            }
        }

/* ===== resources\views\events\show.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
        }

        .events-show-page { position: relative; }

        .event-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 20px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 30%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .event-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-dim { color: var(--hud-muted) !important; }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .teacher-avatar {
            width: 92px;
            height: 92px;
            border-radius: 22px;
            object-fit: cover;
            border: 1px solid rgba(167, 238, 251, .28);
            background: rgba(255, 255, 255, .06);
            box-shadow: 0 0 25px rgba(45, 212, 191, .18);
        }

        .badge-soft {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .7rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .18);
            font-size: .78rem;
            font-weight: 700;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, .72) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .24),
                0 0 22px rgba(45, 212, 191, .22),
                0 18px 42px rgba(0, 0, 0, .42) !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .row-eq > [class^="col-"],
        .row-eq > [class*=" col-"] {
            display: flex;
        }

        .row-eq .card { flex: 1 1 auto; }

        .switch { min-width: 300px; }

        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .nav-tabs {
            border-bottom: 1px solid var(--hud-line);
            gap: .35rem;
        }

        .nav-tabs .nav-link {
            border: 1px solid transparent;
            color: var(--hud-muted);
            border-radius: 999px;
            padding: .55rem .85rem;
        }

        .nav-tabs .nav-link:hover {
            border-color: rgba(167, 238, 251, .22);
            color: var(--hud-blue);
        }

        .nav-tabs .nav-link.active {
            color: #49d9ec;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            border-color: transparent;
            font-weight: 800;
        }

        .kv dt {
            color: var(--hud-muted);
            font-weight: 600;
        }

        .kv dd {
            margin-bottom: .45rem;
            color: var(--hud-text);
        }

        .details-title {
            display: flex;
            align-items: center;
            gap: .35rem;
        }

        .absence-details-header { gap: .75rem; }

        .modal-content {
            border: 1px solid var(--hud-line);
            background: rgba(15, 23, 42, .98);
            color: var(--hud-text);
            border-radius: 18px;
        }

        .modal-header,
        .modal-footer {
            border-color: var(--hud-line);
        }

        html[dir="rtl"] .details-title {
            flex-direction: row-reverse;
            justify-content: flex-start;
            text-align: right;
        }

        html[dir="rtl"] .absence-details-header {
            flex-direction: row-reverse;
        }

        html[dir="rtl"] .card-header .small.text-dim {
            text-align: left;
        }

        html[dir="rtl"] .nav-tabs {
            flex-direction: row-reverse;
        }

        html[dir="rtl"] .nav-tabs .nav-link i {
            margin-left: .25rem !important;
            margin-right: 0 !important;
        }

        html[dir="rtl"] .kv dt { text-align: right; }
        html[dir="rtl"] .kv dd { text-align: left; }
        html[dir="rtl"] .event-hero .text-dim { text-align: right; }

        html[dir="rtl"] .form-label,
        html[dir="rtl"] .form-select,
        html[dir="rtl"] .btn,
        html[dir="rtl"] .alert,
        html[dir="rtl"] .card-body,
        html[dir="rtl"] .card-header {
            text-align: right;
        }

        html[dir="rtl"] .form-select { direction: rtl; }

        @media (max-width: 768px) {
            .event-hero { padding: 1rem; }
            .switch { min-width: 100%; }

            .teacher-avatar {
                width: 78px;
                height: 78px;
            }

            html[dir="rtl"] .absence-details-header {
                flex-direction: column;
                align-items: flex-start !important;
            }

            html[dir="rtl"] .card-header .small.text-dim {
                width: 100%;
                text-align: right;
            }

            html[dir="rtl"] .nav-tabs .nav-item {
                flex: 1 1 auto;
            }

            html[dir="rtl"] .nav-tabs .nav-link {
                width: 100%;
                font-size: .9rem;
                white-space: nowrap;
            }
        }

/* ===== resources\views\families\index.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        /* Modal z-index management */
        .modal {
            z-index: 2000 !important;
        }

        .modal-backdrop {
            z-index: 1999 !important;
        }

        .modal-backdrop.show {
            z-index: 1999 !important;
        }

        /* Isolate modal from other stacking contexts */
        .modal.fade {
            isolation: isolate;
        }

        /* Support widget should not interfere */
        #supportWidgetModal {
            z-index: 3000 !important;
        }

        #supportWidgetModal ~ .modal-backdrop {
            z-index: 2999 !important;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background:  #a7eefb;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .hud-card,
        .stats-card,
        .class-tile-card,
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .hud-card::before,
        .stats-card::before,
        .class-tile-card::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .hud-card:hover,
        .stats-card:hover,
        .class-tile-card:hover,
        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer,
        .stats-card .card-body,
        .stats-card .card-header,
        .stats-card .card-footer,
        .class-tile-card .card-body,
        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .stats-value {
            margin-top: .6rem;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
        }

        .soft-badge.badge-room {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.4);
            color: #cbd5e1;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-card .text-muted,
        .stats-card .text-muted,
        .table-hud-wrap .text-muted,
        .card .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .breadcrumb-hud {
            margin-bottom: 1rem;
        }

        .breadcrumb-hud .breadcrumb {
            margin-bottom: 0;
            background: transparent;
            padding: 0;
        }

        .breadcrumb-hud .breadcrumb-item,
        .breadcrumb-hud .breadcrumb-item a {
            color: rgba(255,255,255,.72);
            text-decoration: none;
        }

        .breadcrumb-hud .breadcrumb-item.active {
            color: #a7eefb;
        }

        .family-avatar {
            width: 46px;
            height: 56px;
            object-fit: cover;
            border-radius: 6px;
            border-color: rgba(45, 212, 191, 0.25);
            background: rgba(15, 23, 42, 0.8);
        }

        .pagination .page-link {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.16);
            color: #2dd4bf;
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.16);
        }

        .action-modal .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 1px;
            background: var(--dark-gradient);
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .action-modal .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .action-modal .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .action-modal .list-group-item:hover {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .class-tile {
            display: block;
            height: 100%;
            text-decoration: none;
        }

        .class-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .class-meta {
            color: rgba(255,255,255,.68);
        }

        /* Family action modal - increased width */
        .action-modal .modal-dialog {
            max-width: 580px;
        }

        @media (max-width: 991.98px) {
            .family-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .family-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\families\index.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        /* Modal z-index management */
        .modal {
            z-index: 2000 !important;
        }

        .modal-backdrop {
            z-index: 1999 !important;
        }

        .modal-backdrop.show {
            z-index: 1999 !important;
        }

        /* Isolate modal from other stacking contexts */
        .modal.fade {
            isolation: isolate;
        }

        /* Support widget should not interfere */
        #supportWidgetModal {
            z-index: 3000 !important;
        }

        #supportWidgetModal ~ .modal-backdrop {
            z-index: 2999 !important;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background:  #a7eefb;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .hud-card,
        .stats-card,
        .class-tile-card,
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .hud-card::before,
        .stats-card::before,
        .class-tile-card::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .hud-card:hover,
        .stats-card:hover,
        .class-tile-card:hover,
        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer,
        .stats-card .card-body,
        .stats-card .card-header,
        .stats-card .card-footer,
        .class-tile-card .card-body,
        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .stats-value {
            margin-top: .6rem;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
        }

        .soft-badge.badge-room {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.4);
            color: #cbd5e1;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-card .text-muted,
        .stats-card .text-muted,
        .table-hud-wrap .text-muted,
        .card .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .breadcrumb-hud {
            margin-bottom: 1rem;
        }

        .breadcrumb-hud .breadcrumb {
            margin-bottom: 0;
            background: transparent;
            padding: 0;
        }

        .breadcrumb-hud .breadcrumb-item,
        .breadcrumb-hud .breadcrumb-item a {
            color: rgba(255,255,255,.72);
            text-decoration: none;
        }

        .breadcrumb-hud .breadcrumb-item.active {
            color: #a7eefb;
        }

        .family-avatar {
            width: 46px;
            height: 56px;
            object-fit: cover;
            border-radius: 6px;
            border-color: rgba(45, 212, 191, 0.25);
            background: rgba(15, 23, 42, 0.8);
        }

        .pagination .page-link {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.16);
            color: #2dd4bf;
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        .pagination .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.16);
        }

        .action-modal .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 1px;
            background: var(--dark-gradient);
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .action-modal .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .action-modal .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .action-modal .list-group-item:hover {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .class-tile {
            display: block;
            height: 100%;
            text-decoration: none;
        }

        .class-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
        }

        .class-meta {
            color: rgba(255,255,255,.68);
        }

        /* Family action modal - increased width */
        .action-modal .modal-dialog {
            max-width: 580px;
        }

        @media (max-width: 991.98px) {
            .family-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .family-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\families\show.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        /*
        |--------------------------------------------------------------------------
        | Correction modal Bootstrap
        |--------------------------------------------------------------------------
        | Le problème venait surtout du fait qu'on ouvrait transferModal
        | pendant qu'une autre modal était encore active.
        */
        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        #transferModal {
            z-index: 1075 !important;
        }

        body.modal-open {
            overflow: hidden;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .btn-outline-neon {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-neon:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .text-neon {
            color: #a7eefb;
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
            color: #fff;
        }

        .page-header {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-dark {
            background: linear-gradient(135deg, rgba(15, 23, 42, 0.5), rgba(30, 41, 59, 0.4)) !important;
            border: 1px solid rgba(45, 212, 191, 0.2);
            color: #e5e7eb;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-warning {
            border-color: rgba(250, 204, 21, 0.4);
            color: #fbbf24;
            background: transparent;
        }

        .btn-outline-warning:hover {
            background: rgba(250, 204, 21, 0.1);
            border-color: rgba(250, 204, 21, 0.6);
            color: #fcd34d;
            transform: translateY(-2px);
        }

        .btn-outline-success {
            border-color: rgba(34, 197, 94, 0.4);
            color: #4ade80;
            background: transparent;
        }

        .btn-outline-success:hover {
            background: rgba(34, 197, 94, 0.1);
            border-color: rgba(34, 197, 94, 0.6);
            color: #86efac;
            transform: translateY(-2px);
        }

        .btn-soft-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-soft-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            transform: translateY(-2px);
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-warning {
            background: linear-gradient(135deg, #fbbf24, #f59e0b);
            border: none;
            color: #0f172a;
        }

        .btn-warning:hover {
            box-shadow: 0 0 20px rgba(250, 204, 21, 0.4);
            transform: translateY(-2px);
        }

        .alert {
            border: 1px solid rgba(245, 158, 11, 0.3);
            background: rgba(245, 158, 11, 0.08);
            color: #fcd34d;
            border-radius: 8px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-secondary {
            border-color: rgba(148, 163, 184, 0.3);
            background: rgba(148, 163, 184, 0.08);
            color: #cbd5e1;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .form-text {
            color: rgba(255,255,255,.58);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
        }

        .table-light {
            background: rgba(45, 212, 191, 0.08) !important;
        }

        .breadcrumb {
            background: transparent;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .breadcrumb-item {
            color: rgba(255,255,255,.72);
        }

        .breadcrumb-item a {
            color: #2dd4bf;
            text-decoration: none;
        }

        .breadcrumb-item.active {
            color: #2dd4bf;
        }

        .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .modal-footer {
            border-top: 1px solid rgba(45, 212, 191, 0.12) !important;
        }

        .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .list-group-item:hover,
        .list-group-item:focus {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .small {
            font-size: .8rem;
        }

        hr {
            border-color: rgba(45, 212, 191, 0.15);
        }

        .min-w-0 {
            min-width: 0;
        }

        .img-thumbnail {
            border: 1px solid rgba(45, 212, 191, 0.25) !important;
            background: rgba(15, 23, 42, 0.8);
        }

        .text-break {
            word-break: break-word;
            overflow-wrap: break-word;
        }

        @media (max-width: 991.98px) {
            .page-header {
                font-size: 1.5rem;
            }
        }

        @media (max-width: 767.98px) {
            .page-header {
                font-size: 1.25rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .btn {
                padding: 0.55rem 1rem;
            }
        }

/* ===== resources\views\families\show.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        /*
        |--------------------------------------------------------------------------
        | Correction modal Bootstrap
        |--------------------------------------------------------------------------
        | Le problème venait surtout du fait qu'on ouvrait transferModal
        | pendant qu'une autre modal était encore active.
        */
        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        #transferModal {
            z-index: 1075 !important;
        }

        body.modal-open {
            overflow: hidden;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        .btn-outline-neon {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-neon:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .text-neon {
            color: #a7eefb;
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
            color: #fff;
        }

        .page-header {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-dark {
            background: linear-gradient(135deg, rgba(15, 23, 42, 0.5), rgba(30, 41, 59, 0.4)) !important;
            border: 1px solid rgba(45, 212, 191, 0.2);
            color: #e5e7eb;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-warning {
            border-color: rgba(250, 204, 21, 0.4);
            color: #fbbf24;
            background: transparent;
        }

        .btn-outline-warning:hover {
            background: rgba(250, 204, 21, 0.1);
            border-color: rgba(250, 204, 21, 0.6);
            color: #fcd34d;
            transform: translateY(-2px);
        }

        .btn-outline-success {
            border-color: rgba(34, 197, 94, 0.4);
            color: #4ade80;
            background: transparent;
        }

        .btn-outline-success:hover {
            background: rgba(34, 197, 94, 0.1);
            border-color: rgba(34, 197, 94, 0.6);
            color: #86efac;
            transform: translateY(-2px);
        }

        .btn-soft-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-soft-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            transform: translateY(-2px);
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-warning {
            background: linear-gradient(135deg, #fbbf24, #f59e0b);
            border: none;
            color: #0f172a;
        }

        .btn-warning:hover {
            box-shadow: 0 0 20px rgba(250, 204, 21, 0.4);
            transform: translateY(-2px);
        }

        .alert {
            border: 1px solid rgba(245, 158, 11, 0.3);
            background: rgba(245, 158, 11, 0.08);
            color: #fcd34d;
            border-radius: 8px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-secondary {
            border-color: rgba(148, 163, 184, 0.3);
            background: rgba(148, 163, 184, 0.08);
            color: #cbd5e1;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .form-text {
            color: rgba(255,255,255,.58);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
        }

        .table-light {
            background: rgba(45, 212, 191, 0.08) !important;
        }

        .breadcrumb {
            background: transparent;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .breadcrumb-item {
            color: rgba(255,255,255,.72);
        }

        .breadcrumb-item a {
            color: #2dd4bf;
            text-decoration: none;
        }

        .breadcrumb-item.active {
            color: #2dd4bf;
        }

        .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.35);
            color: #fff;
        }

        .modal-header {
            background: transparent;
            color: #fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.12);
        }

        .modal-footer {
            border-top: 1px solid rgba(45, 212, 191, 0.12) !important;
        }

        .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45, 212, 191, 0.1);
        }

        .list-group-item:hover,
        .list-group-item:focus {
            background: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .small {
            font-size: .8rem;
        }

        hr {
            border-color: rgba(45, 212, 191, 0.15);
        }

        .min-w-0 {
            min-width: 0;
        }

        .img-thumbnail {
            border: 1px solid rgba(45, 212, 191, 0.25) !important;
            background: rgba(15, 23, 42, 0.8);
        }

        .text-break {
            word-break: break-word;
            overflow-wrap: break-word;
        }

        @media (max-width: 991.98px) {
            .page-header {
                font-size: 1.5rem;
            }
        }

        @media (max-width: 767.98px) {
            .page-header {
                font-size: 1.25rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .btn {
                padding: 0.55rem 1rem;
            }
        }

/* ===== resources\views\health-dashboard\index.blade.php :: <style> ===== */
:root {
            --health-primary: #2dd4bf;
            --health-danger: #ef4444;
            --health-success: #10b981;
            --health-warning: #f59e0b;
            --health-info: #3b82f6;
        }

        body {
            background: linear-gradient(135deg, #0f172a 0%, #1a1f35 100%);
        }

        .card {
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.005) 100%);
            border: 1px solid rgba(45, 212, 191, 0.1);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
        }

        .card::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(45, 212, 191, 0.1), transparent);
            transition: left 0.5s ease;
            pointer-events: none;
        }

        .card:hover {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08) 0%, rgba(45, 212, 191, 0.03) 100%);
            border-color: rgba(45, 212, 191, 0.3) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.2),
                0 0 20px rgba(45, 212, 191, 0.15),
                0 0 40px rgba(45, 212, 191, 0.08),
                0 20px 40px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card:hover::before {
            left: 100%;
        }

        .card-body {
            position: relative;
            z-index: 1;
        }

        /* Section Header */
        .health-header {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.05) 0%, rgba(45, 212, 191, 0.02) 100%);
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 2px;
            padding: 2rem;
            margin-bottom: 2rem;
        }

        .health-header h1 {
            background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            font-size: 2.5rem;
            font-weight: 700;
            letter-spacing: -0.02em;
        }

        .health-header p {
            color: rgba(255, 255, 255, 0.6);
            font-size: 1.05rem;
            margin: 0.5rem 0 0 0;
        }

        /* Action Buttons */
        .action-card {
            position: relative;
            overflow: hidden;
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        .action-card .card-body {
            padding: 1.5rem;
        }

        .action-card:hover {
            transform: translateY(-6px);
        }

        .action-card i {
            display: inline-block;
            transition: transform 0.3s ease;
        }

        .action-card:hover i {
            transform: scale(1.1) rotate(5deg);
        }

        /* Alert Styles */
        .alert {
            border-left: 4px solid;
            border-radius: 2px;
            backdrop-filter: blur(10px);
            background: rgba(255, 255, 255, 0.05);
        }

        .alert-danger {
            border-left-color: #ef4444;
            background: rgba(239, 68, 68, 0.08);
        }

        .alert-warning {
            border-left-color: #f59e0b;
            background: rgba(245, 158, 11, 0.08);
        }

        .alert-success {
            border-left-color: #10b981;
            background: rgba(16, 185, 129, 0.08);
        }

        .alert-info {
            border-left-color: #3b82f6;
            background: rgba(59, 130, 246, 0.08);
        }

        /* Stat Cards */
        .stat-card {
        /*  background: linear-gradient(135deg, rgba(45, 212, 191, 0.05) 0%, rgba(45, 212, 191, 0.01) 100%); */
            border-radius: 2px;
        /*    padding: 1.5rem; */
              transition: all 0.3s ease;
            }

            .stat-card:hover {
                /*   background: linear-gradient(135deg, rgba(45, 212, 191, 0.1) 0%, rgba(45, 212, 191, 0.05) 100%); */
               transform: translateY(-1px);
           }

           .stat-card .text-muted {
               font-size: 0.85rem;
               text-transform: uppercase;
               letter-spacing: 0.05em;
               font-weight: 500;
           }

           .stat-card .fs-4 {
               margin: 0.75rem 0;
               font-size: 1.75rem !important;
               background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
               -webkit-background-clip: text;
               -webkit-text-fill-color: transparent;
               background-clip: text;
           }

           /* Targets Box */
        .targets-box {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08) 0%, rgba(45, 212, 191, 0.02) 100%);
            border: 1px solid rgba(45, 212, 191, 0.15);
            border-radius: 2px;
            padding: 1.5rem;
            transition: all 0.3s ease;
        }

        .targets-box:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 10px 30px rgba(45, 212, 191, 0.1);
        }

        .targets-box .fw-bold {
            color: #2dd4bf;
            font-size: 1.25rem;
        }

        /* Filter Form */
        .filter-card {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.04) 0%, rgba(45, 212, 191, 0.01) 100%);
            border: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 2px;
        }

        .form-select, .form-control {
            background-color: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(45, 212, 191, 0.15);
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        .form-select:focus, .form-control:focus {
            background-color: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.1);
        }

        /* Button Styles */
        .btn-success {
            background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
            border: none;
            transition: all 0.3s ease;
            font-weight: 500;
            letter-spacing: 0.02em;
        }

        .btn-success:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 20px rgba(45, 212, 191, 0.2);
        }

        .btn-outline-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            transition: all 0.3s ease;
        }

        .btn-outline-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.5);
        }

        /* Chart Container */
        .chart-container {
            position: relative;
            border-radius: 2px;
            overflow: hidden;
        }

        /* Table Styles */
        .table {
            color: rgba(255, 255, 255, 0.8);
        }

        .table thead {
            background: rgba(45, 212, 191, 0.05);
            border-bottom: 2px solid rgba(45, 212, 191, 0.15);
        }

        .table thead th {
            color: #2dd4bf;
            font-weight: 600;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.05em;
            padding: 1rem;
        }

        .table tbody tr {
            border-bottom: 1px solid rgba(45, 212, 191, 0.05);
            transition: all 0.2s ease;
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, 0.03);
        }

        .table tbody td {
            padding: 1rem;
            vertical-align: middle;
        }

        /* Section Title */
        h5 {
            color: rgba(255, 255, 255, 0.95);
            font-weight: 600;
            letter-spacing: -0.01em;
        }

        h5 i {
            color: #2dd4bf;
            margin-right: 0.5rem;
        }

        /* Badge Styles */
        .badge {
            padding: 0.5rem 0.75rem;
            font-size: 0.85rem;
            font-weight: 500;
            letter-spacing: 0.02em;
            border-radius: 2px;
        }

        .badge.bg-info {
            background: rgba(59, 130, 246, 0.15) !important;
            color: #60a5fa !important;
            border: 1px solid rgba(59, 130, 246, 0.3);
        }

        .badge.bg-success {
            background: rgba(16, 185, 129, 0.15) !important;
            color: #34d399 !important;
            border: 1px solid rgba(16, 185, 129, 0.3);
        }

        /* Container Styling */
        .container-fluid {
            position: relative;
        }

        /* Smooth Scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        ::-webkit-scrollbar-track {
            background: rgba(45, 212, 191, 0.05);
        }

        ::-webkit-scrollbar-thumb {
            background: rgba(45, 212, 191, 0.2);
            border-radius: 2px;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: rgba(45, 212, 191, 0.4);
        }

        /* Responsive */
        @media (max-width: 768px) {
            .health-header {
                padding: 1.5rem;
            }

            .health-header h1 {
                font-size: 1.75rem;
            }

            .stat-card {
                padding: 1rem;
            }

            .action-card .card-body {
                padding: 1.25rem;
            }

            .filter-card .card-body {
                padding: 1.25rem;
            }
        }

/* ===== resources\views\health-dashboard\index.blade.php :: @push(css) ===== */

        :root {
            --health-primary: #2dd4bf;
            --health-danger: #ef4444;
            --health-success: #10b981;
            --health-warning: #f59e0b;
            --health-info: #3b82f6;
        }

        body {
            background: linear-gradient(135deg, #0f172a 0%, #1a1f35 100%);
        }

        .card {
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.005) 100%);
            border: 1px solid rgba(45, 212, 191, 0.1);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
        }

        .card::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(45, 212, 191, 0.1), transparent);
            transition: left 0.5s ease;
            pointer-events: none;
        }

        .card:hover {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08) 0%, rgba(45, 212, 191, 0.03) 100%);
            border-color: rgba(45, 212, 191, 0.3) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.2),
                0 0 20px rgba(45, 212, 191, 0.15),
                0 0 40px rgba(45, 212, 191, 0.08),
                0 20px 40px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card:hover::before {
            left: 100%;
        }

        .card-body {
            position: relative;
            z-index: 1;
        }

        /* Section Header */
        .health-header {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.05) 0%, rgba(45, 212, 191, 0.02) 100%);
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 2px;
            padding: 2rem;
            margin-bottom: 2rem;
        }

        .health-header h1 {
            background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            font-size: 2.5rem;
            font-weight: 700;
            letter-spacing: -0.02em;
        }

        .health-header p {
            color: rgba(255, 255, 255, 0.6);
            font-size: 1.05rem;
            margin: 0.5rem 0 0 0;
        }

        /* Action Buttons */
        .action-card {
            position: relative;
            overflow: hidden;
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        .action-card .card-body {
            padding: 1.5rem;
        }

        .action-card:hover {
            transform: translateY(-6px);
        }

        .action-card i {
            display: inline-block;
            transition: transform 0.3s ease;
        }

        .action-card:hover i {
            transform: scale(1.1) rotate(5deg);
        }

        /* Alert Styles */
        .alert {
            border-left: 4px solid;
            border-radius: 2px;
            backdrop-filter: blur(10px);
            background: rgba(255, 255, 255, 0.05);
        }

        .alert-danger {
            border-left-color: #ef4444;
            background: rgba(239, 68, 68, 0.08);
        }

        .alert-warning {
            border-left-color: #f59e0b;
            background: rgba(245, 158, 11, 0.08);
        }

        .alert-success {
            border-left-color: #10b981;
            background: rgba(16, 185, 129, 0.08);
        }

        .alert-info {
            border-left-color: #3b82f6;
            background: rgba(59, 130, 246, 0.08);
        }

        /* Stat Cards */
        .stat-card {
        /*  background: linear-gradient(135deg, rgba(45, 212, 191, 0.05) 0%, rgba(45, 212, 191, 0.01) 100%); */
            border-radius: 2px;
        /*    padding: 1.5rem; */
              transition: all 0.3s ease;
            }

            .stat-card:hover {
                /*   background: linear-gradient(135deg, rgba(45, 212, 191, 0.1) 0%, rgba(45, 212, 191, 0.05) 100%); */
               transform: translateY(-1px);
           }

           .stat-card .text-muted {
               font-size: 0.85rem;
               text-transform: uppercase;
               letter-spacing: 0.05em;
               font-weight: 500;
           }

           .stat-card .fs-4 {
               margin: 0.75rem 0;
               font-size: 1.75rem !important;
               background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
               -webkit-background-clip: text;
               -webkit-text-fill-color: transparent;
               background-clip: text;
           }

           /* Targets Box */
        .targets-box {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08) 0%, rgba(45, 212, 191, 0.02) 100%);
            border: 1px solid rgba(45, 212, 191, 0.15);
            border-radius: 2px;
            padding: 1.5rem;
            transition: all 0.3s ease;
        }

        .targets-box:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 10px 30px rgba(45, 212, 191, 0.1);
        }

        .targets-box .fw-bold {
            color: #2dd4bf;
            font-size: 1.25rem;
        }

        /* Filter Form */
        .filter-card {
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.04) 0%, rgba(45, 212, 191, 0.01) 100%);
            border: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 2px;
        }

        .form-select, .form-control {
            background-color: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(45, 212, 191, 0.15);
            border-radius: 2px;
            transition: all 0.3s ease;
        }

        .form-select:focus, .form-control:focus {
            background-color: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.1);
        }

        /* Button Styles */
        .btn-success {
            background: linear-gradient(135deg, #2dd4bf 0%, #06b6d4 100%);
            border: none;
            transition: all 0.3s ease;
            font-weight: 500;
            letter-spacing: 0.02em;
        }

        .btn-success:hover {
            transform: translateY(-2px);
            box-shadow: 0 10px 20px rgba(45, 212, 191, 0.2);
        }

        .btn-outline-secondary {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            transition: all 0.3s ease;
        }

        .btn-outline-secondary:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.5);
        }

        /* Chart Container */
        .chart-container {
            position: relative;
            border-radius: 2px;
            overflow: hidden;
        }

        /* Table Styles */
        .table {
            color: rgba(255, 255, 255, 0.8);
        }

        .table thead {
            background: rgba(45, 212, 191, 0.05);
            border-bottom: 2px solid rgba(45, 212, 191, 0.15);
        }

        .table thead th {
            color: #2dd4bf;
            font-weight: 600;
            text-transform: uppercase;
            font-size: 0.8rem;
            letter-spacing: 0.05em;
            padding: 1rem;
        }

        .table tbody tr {
            border-bottom: 1px solid rgba(45, 212, 191, 0.05);
            transition: all 0.2s ease;
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, 0.03);
        }

        .table tbody td {
            padding: 1rem;
            vertical-align: middle;
        }

        /* Section Title */
        h5 {
            color: rgba(255, 255, 255, 0.95);
            font-weight: 600;
            letter-spacing: -0.01em;
        }

        h5 i {
            color: #2dd4bf;
            margin-right: 0.5rem;
        }

        /* Badge Styles */
        .badge {
            padding: 0.5rem 0.75rem;
            font-size: 0.85rem;
            font-weight: 500;
            letter-spacing: 0.02em;
            border-radius: 2px;
        }

        .badge.bg-info {
            background: rgba(59, 130, 246, 0.15) !important;
            color: #60a5fa !important;
            border: 1px solid rgba(59, 130, 246, 0.3);
        }

        .badge.bg-success {
            background: rgba(16, 185, 129, 0.15) !important;
            color: #34d399 !important;
            border: 1px solid rgba(16, 185, 129, 0.3);
        }

        /* Container Styling */
        .container-fluid {
            position: relative;
        }

        /* Smooth Scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        ::-webkit-scrollbar-track {
            background: rgba(45, 212, 191, 0.05);
        }

        ::-webkit-scrollbar-thumb {
            background: rgba(45, 212, 191, 0.2);
            border-radius: 2px;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: rgba(45, 212, 191, 0.4);
        }

        /* Responsive */
        @media (max-width: 768px) {
            .health-header {
                padding: 1.5rem;
            }

            .health-header h1 {
                font-size: 1.75rem;
            }

            .stat-card {
                padding: 1rem;
            }

            .action-card .card-body {
                padding: 1.25rem;
            }

            .filter-card .card-body {
                padding: 1.25rem;
            }
        }

/* ===== resources\views\home.blade.php :: <style> ===== */
:root {
            --dash-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --dash-card: rgba(15,23,42,.82);
            --dash-border: rgba(45,212,191,.18);
            --dash-cyan: #2dd4bf;
            --dash-cyan-soft: #a7eefb;
            --dash-purple: #a78bfa;
            --dash-yellow: #fbbf24;
            --dash-muted: rgba(255,255,255,.58);
        }

        .dashboard-page {
            color: #fff;
        }

        .dashboard-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--dash-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.15), transparent 34%),
                var(--dash-bg) !important;
            box-shadow: 0 22px 60px rgba(0,0,0,.32) !important;
        }

        .dashboard-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .dashboard-hero .card-body {
            position: relative;
            z-index: 2;
        }

        .dash-title {
            font-size: 1.25rem;
            font-weight: 500;
            letter-spacing: .5px;
            margin-bottom: .35rem;
        }

        .dash-subtitle {
            color: var(--dash-muted);
            max-width: 760px;
        }

        .dash-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .55rem .78rem;
            border-radius: 999px;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--dash-cyan-soft);
            font-weight: 700;
            font-size: .82rem;
        }

        .dash-avatar {
            width: 92px;
            height: 102px;
            border-radius: 18px;
            overflow: hidden;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.16);
            flex-shrink: 0;
        }

        .dash-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .dash-card {
            position: relative;
            overflow: hidden;
            height: 100%;
            border: 1px solid var(--dash-border) !important;
            border-radius: 16px !important;
            background: var(--dash-bg) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,.24) !important;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .dash-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.16),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .dash-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .dash-card .card-body {
            position: relative;
            z-index: 2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--dash-cyan-soft);
            flex-shrink: 0;
        }

        .quick-box {
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.45);
            border-radius: 14px;
            padding: 1rem;
            height: 100%;
        }

        .quick-box i {
            color: var(--dash-cyan-soft);
        }

        .illustration-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: saturate(1.08) contrast(1.05);
            transition: transform .4s ease;
        }

        .illustration-card:hover img {
            transform: scale(1.04);
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a !important;
            border: none;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--dash-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--dash-muted) !important;
        }

        .gallery-img {
            border-radius: 14px;
            overflow: hidden;
            border: 1px solid rgba(45,212,191,.16);
            background: rgba(15,23,42,.65);
        }

        .gallery-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .35s ease;
        }

        .gallery-img:hover img {
            transform: scale(1.08);
        }

        .info-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

        .info-list li {
            display: flex;
            gap: .75rem;
            padding: .85rem 0;
            border-bottom: 1px solid rgba(45,212,191,.1);
            color: rgba(255,255,255,.72);
        }

        .info-list li:last-child {
            border-bottom: 0;
            padding-bottom: 0;
        }

        .info-list i {
            color: var(--dash-cyan-soft);
            margin-top: .15rem;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        @media (max-width: 767.98px) {
            .dashboard-hero,
            .dash-card {
                border-radius: 14px !important;
            }

            .dash-avatar {
                width: 74px;
                height: 82px;
                border-radius: 14px;
            }

            .dash-title {
                font-size: 1.45rem;
            }

            .btn {
                width: 100%;
            }
        }

/* ===== resources\views\home.blade.php :: @push(css) ===== */

        :root {
            --dash-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --dash-card: rgba(15,23,42,.82);
            --dash-border: rgba(45,212,191,.18);
            --dash-cyan: #2dd4bf;
            --dash-cyan-soft: #a7eefb;
            --dash-purple: #a78bfa;
            --dash-yellow: #fbbf24;
            --dash-muted: rgba(255,255,255,.58);
        }

        .dashboard-page {
            color: #fff;
        }

        .dashboard-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--dash-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.15), transparent 34%),
                var(--dash-bg) !important;
            box-shadow: 0 22px 60px rgba(0,0,0,.32) !important;
        }

        .dashboard-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .dashboard-hero .card-body {
            position: relative;
            z-index: 2;
        }

        .dash-title {
            font-size: 1.25rem;
            font-weight: 500;
            letter-spacing: .5px;
            margin-bottom: .35rem;
        }

        .dash-subtitle {
            color: var(--dash-muted);
            max-width: 760px;
        }

        .dash-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .55rem .78rem;
            border-radius: 999px;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--dash-cyan-soft);
            font-weight: 700;
            font-size: .82rem;
        }

        .dash-avatar {
            width: 92px;
            height: 102px;
            border-radius: 18px;
            overflow: hidden;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.16);
            flex-shrink: 0;
        }

        .dash-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .dash-card {
            position: relative;
            overflow: hidden;
            height: 100%;
            border: 1px solid var(--dash-border) !important;
            border-radius: 16px !important;
            background: var(--dash-bg) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,.24) !important;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .dash-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.16),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .dash-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .dash-card .card-body {
            position: relative;
            z-index: 2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--dash-cyan-soft);
            flex-shrink: 0;
        }

        .quick-box {
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.45);
            border-radius: 14px;
            padding: 1rem;
            height: 100%;
        }

        .quick-box i {
            color: var(--dash-cyan-soft);
        }

        .illustration-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: saturate(1.08) contrast(1.05);
            transition: transform .4s ease;
        }

        .illustration-card:hover img {
            transform: scale(1.04);
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a !important;
            border: none;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--dash-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--dash-muted) !important;
        }

        .gallery-img {
            border-radius: 14px;
            overflow: hidden;
            border: 1px solid rgba(45,212,191,.16);
            background: rgba(15,23,42,.65);
        }

        .gallery-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .35s ease;
        }

        .gallery-img:hover img {
            transform: scale(1.08);
        }

        .info-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

        .info-list li {
            display: flex;
            gap: .75rem;
            padding: .85rem 0;
            border-bottom: 1px solid rgba(45,212,191,.1);
            color: rgba(255,255,255,.72);
        }

        .info-list li:last-child {
            border-bottom: 0;
            padding-bottom: 0;
        }

        .info-list i {
            color: var(--dash-cyan-soft);
            margin-top: .15rem;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        @media (max-width: 767.98px) {
            .dashboard-hero,
            .dash-card {
                border-radius: 14px !important;
            }

            .dash-avatar {
                width: 74px;
                height: 82px;
                border-radius: 14px;
            }

            .dash-title {
                font-size: 1.45rem;
            }

            .btn {
                width: 100%;
            }
        }

/* ===== resources\views\homeworks\calendar.blade.php :: <style> ===== */
.fc .fc-toolbar-title{font-size:1.15rem}
        .card-h100{height:100%}
        .calendar-wrap{min-height: 680px}
        .table-wrap{min-height: 680px; overflow:auto}
        .badge-room{font-size:.75rem}

/* ===== resources\views\homeworks\calendar.blade.php :: @push(css) ===== */

        .fc .fc-toolbar-title{font-size:1.15rem}
        .card-h100{height:100%}
        .calendar-wrap{min-height: 680px}
        .table-wrap{min-height: 680px; overflow:auto}
        .badge-room{font-size:.75rem}

/* ===== resources\views\homeworks\index.blade.php :: <style> ===== */
.dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

         .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\homeworks\show.blade.php :: <style> ===== */
.progress-bar {
            position: relative;
        }
        .progress-bar-label {
            position: absolute;
            top: -25px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 12px;
            color: #fff;
        }

/* ===== resources\views\layout\default.blade.php :: <style> ===== */
html[lang="ar"] {
        font-family: "Cairo", sans-serif;
        font-size: 18px;
        line-height: 1.8;
        direction: rtl;
    }

/* ===== resources\views\layout\public.blade.php :: <style> ===== */
/* Remplace complètement la section :root + styles principaux dans
           resources/views/layout/public.blade.php
           pour obtenir un design clair, moderne et lumineux. */

        :root {
            --pub-bg: #f8fbff;
            --pub-bg-2: #eef6ff;
            --pub-card: rgba(255, 255, 255, 0.96);
            --pub-card-solid: #ffffff;

            --pub-border: rgba(15, 23, 42, 0.08);
            --pub-border-strong: rgba(14, 165, 233, 0.28);

            --pub-text: #0f172a;
            --pub-text-soft: #64748b;

            --pub-primary: #0ea5e9;
            --pub-primary-dark: #0284c7;
            --pub-secondary: #22c55e;
            --pub-warning: #f59e0b;

            --pub-shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.06);
            --pub-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
            --pub-shadow-lg: 0 30px 80px rgba(14, 165, 233, 0.10);
        }

        html,
        body {
            min-height: 100%;
            background:
                radial-gradient(circle at top left, rgba(14, 165, 233, 0.08), transparent 40rem),
                radial-gradient(circle at top right, rgba(34, 197, 94, 0.05), transparent 36rem),
                linear-gradient(180deg, var(--pub-bg), var(--pub-bg-2));
            color: var(--pub-text);
            overflow-x: hidden;
        }

        body {
            font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            line-height: 1.65;
        }

        /* Liens */
        a {
            color: var(--pub-primary);
            text-decoration: none;
        }

        a:hover {
            color: var(--pub-primary-dark);
        }

        /* Navbar */
        .public-navbar {
            position: sticky;
            top: 0;
            z-index: 1030;
            background: rgba(255, 255, 255, 0.88);
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            border-bottom: 1px solid var(--pub-border);
            box-shadow: 0 4px 24px rgba(15, 23, 42, 0.04);
        }

        .public-brand {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            color: var(--pub-text);
            font-weight: 800;
            font-size: 1.1rem;
            letter-spacing: 0.02em;
        }

        .public-brand:hover {
            color: var(--pub-text);
        }

        .public-brand-logo {
            width: 44px;
            height: 44px;
            border-radius: 14px;
            object-fit: cover;
            border: 1px solid var(--pub-border);
            box-shadow: var(--pub-shadow-sm);
        }

        /* Menu */
        .public-nav-link {
            color: var(--pub-text-soft);
            font-weight: 600;
            padding: 0.55rem 0.85rem;
            border-radius: 999px;
            transition: all 0.25s ease;
        }

        .public-nav-link:hover,
        .public-nav-link.active {
            color: var(--pub-primary-dark);
            background: rgba(14, 165, 233, 0.08);
        }

        /* Bouton principal */
        .btn-public-neon {
            border: 0;
            border-radius: 999px;
            padding: 0.75rem 1.4rem;
            font-weight: 700;
            color: #ffffff;
            background: linear-gradient(135deg, var(--pub-primary), #38bdf8);
            box-shadow: 0 12px 30px rgba(14, 165, 233, 0.22);
            transition: all 0.25s ease;
        }

        .btn-public-neon:hover {
            color: #ffffff;
            transform: translateY(-2px);
            box-shadow: 0 18px 36px rgba(14, 165, 233, 0.28);
        }

        /* Bouton secondaire */
        .btn-public-outline {
            border: 1px solid var(--pub-border-strong);
            border-radius: 999px;
            padding: 0.75rem 1.4rem;
            font-weight: 700;
            color: var(--pub-primary-dark);
            background: #ffffff;
            transition: all 0.25s ease;
        }

        .btn-public-outline:hover {
            color: #ffffff;
            background: var(--pub-primary);
            border-color: var(--pub-primary);
        }

        /* Cartes */
        .public-card {
            background: var(--pub-card);
            border: 1px solid var(--pub-border);
            border-radius: 28px;
            box-shadow: var(--pub-shadow);
            backdrop-filter: blur(10px);
        }

        .public-card:hover {
            box-shadow: var(--pub-shadow-lg);
        }

        /* Sections */
        .public-section {
            padding: 5rem 0;
        }

        .public-section-sm {
            padding: 3rem 0;
        }

        /* Badge */
        .public-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            padding: 0.45rem 0.9rem;
            border-radius: 999px;
            font-size: 0.85rem;
            font-weight: 700;
            color: var(--pub-primary-dark);
            background: rgba(14, 165, 233, 0.08);
            border: 1px solid rgba(14, 165, 233, 0.12);
        }

        /* Texte secondaire */
        .text-soft {
            color: var(--pub-text-soft);
        }

        /* Footer */
        .public-footer {
            background: #ffffff;
            border-top: 1px solid var(--pub-border);
            color: var(--pub-text-soft);
        }

        .public-footer strong {
            color: var(--pub-text);
        }

        .public-footer a {
            color: var(--pub-text-soft);
        }

        .public-footer a:hover {
            color: var(--pub-primary);
        }

        /* Bouton menu mobile */
        .mobile-menu-btn {
            border: 1px solid var(--pub-border);
            background: #ffffff;
            color: var(--pub-text);
            border-radius: 14px;
            padding: 0.5rem 0.75rem;
        }

        .mobile-menu-btn:hover {
            background: rgba(14, 165, 233, 0.05);
        }

        /* Menu mobile */
        @media (max-width: 991.98px) {
            .public-section {
                padding: 3.5rem 0;
            }

            .public-mobile-menu {
                margin-top: 1rem;
                padding: 1rem;
                background: #ffffff;
                border: 1px solid var(--pub-border);
                border-radius: 22px;
                box-shadow: var(--pub-shadow);
            }

            .public-nav-link {
                display: block;
                width: 100%;
            }
        }

        /* RTL */
        html[dir="rtl"] .me-1,
        html[dir="rtl"] .me-2,
        html[dir="rtl"] .me-3 {
            margin-right: 0 !important;
            margin-left: 0.5rem !important;
        }

/* ===== resources\views\learning\library\create.blade.php :: <style> ===== */
.form-hint{font-size:.9rem;color:#6c757d}
        .required:after{content:" *";color:#dc3545}
        .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\learning\library\create.blade.php :: @push(css) ===== */

        .form-hint{font-size:.9rem;color:#6c757d}
        .required:after{content:" *";color:#dc3545}
        .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\learning\library\index.blade.php :: <style> ===== */
.kk-search .form-control { height: 42px; }
        .kk-card { transition: .15s ease; }
        .kk-card:hover { transform: translateY(-2px); }
        .kk-ar { direction: rtl; font-size: 1.05rem; line-height: 1.9; }
        .kk-badge { font-weight: 600; letter-spacing: .3px; }
        .kk-tags .badge { margin-right: .25rem; margin-bottom: .25rem; }
        .kk-stars { font-size: .9rem; color: #f59f00; }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }
         .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\learning\library\index.blade.php :: @push(css) ===== */

        .kk-search .form-control { height: 42px; }
        .kk-card { transition: .15s ease; }
        .kk-card:hover { transform: translateY(-2px); }
        .kk-ar { direction: rtl; font-size: 1.05rem; line-height: 1.9; }
        .kk-badge { font-weight: 600; letter-spacing: .3px; }
        .kk-tags .badge { margin-right: .25rem; margin-bottom: .25rem; }
        .kk-stars { font-size: .9rem; color: #f59f00; }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }
         .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\learning\library\show.blade.php :: <style> ===== */
.arabic { font-size: 1.4rem; line-height: 2; direction: rtl; text-align: right; }
        .badge-tag { margin-right: .25rem; }
        .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\learning\library\show.blade.php :: @push(css) ===== */

        .arabic { font-size: 1.4rem; line-height: 2; direction: rtl; text-align: right; }
        .badge-tag { margin-right: .25rem; }
        .form-select, select {
             color: #498ed3;
             background-color: transparent !important;
         }

/* ===== resources\views\luminous_assignments\create.blade.php :: <style> ===== */
.form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

/* ===== resources\views\luminous_assignments\create.blade.php :: @push(css) ===== */
<!-- required js / css -->

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

/* ===== resources\views\luminous_assignments\index.blade.php :: <style> ===== */
.dt-buttons {
            display:none !important;
            visibility: hidden !important;
        }
        .dt-length{
            display:none !important;
            visibility: hidden !important;
        }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        /* =========================
           GLOBAL HUD STYLE
        ========================= */
        .hud-card {
            border: 1px solid rgba(148, 163, 184, .20);
            border-radius: 4px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer {
            position: relative;
            z-index: 2;
        }

        .hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.07);
            background: transparent;
            color: #fff;
        }

        .hud-title {
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .35px;
            color: #fff;
        }

        .hero-light-card {
            position: relative;
            overflow: hidden;
            border-radius: 4px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border: 1px solid rgba(148,163,184,.18);
            box-shadow: 0 10px 30px rgba(0,0,0,.08);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 4px;
            background: #111827;
            color: #fff;
            font-size: .80rem;
            font-weight: 700;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 4px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            backdrop-filter: blur(4px);
        }

        .soft-badge.badge-room {
            background: rgba(255,255,255,.04);
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.22);
            color: #bfdbfe;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.22);
            color: #bbf7d0;
        }

        .soft-badge.badge-danger {
            border-color: rgba(239,68,68,.22);
            color: #fecaca;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.22);
            color: #fde68a;
        }

        .soft-badge.badge-muted {
            border-color: rgba(148,163,184,.22);
            color: #cbd5e1;
        }

        .hero-actions .btn {
            border-radius: 4px;
        }

        /* =========================
           TABLE HUD
        ========================= */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .table-hud-wrap .table a {
            color: #fff;
        }

        .table-hud-wrap .table a:hover {
            color: #fde68a;
        }

        .table-hud-wrap .text-muted,
        .hud-card .text-muted,
        .hud-card .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .status-pill {
            min-width: 110px;
            justify-content: center;
            font-weight: 700;
        }

        .pagination .page-link {
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .pagination .page-item.active .page-link {
            background: #0d6efd;
            border-color: #0d6efd;
            color: #fff;
        }

        .pagination .page-link:hover {
            color: #fde68a;
            background: rgba(255,255,255,.10);
        }

        @media (max-width: 991.98px) {
            .hero-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .hero-actions .btn,
            .hero-actions a {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .hud-card,
            .hero-light-card {
                border-radius: 4px;
            }
        }
        .text-neon {
            color: #a7eefb;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\memorization\index.blade.php :: <style> ===== */
.dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dataTables_filter input {
            min-width: 240px;
            border-radius: 12px !important;
        }

        .form-select,
        select {
            color: #7cb8ff;
            background-color: transparent !important;
        }

        .memorization-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.08);
            background:
                radial-gradient(circle at top right, rgba(58,123,213,.18), transparent 35%),
                radial-gradient(circle at bottom left, rgba(0,210,255,.10), transparent 30%),
                linear-gradient(135deg, rgba(13,18,31,.96), rgba(20,28,45,.96));
            border-radius: 1px;
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }

        .memorization-hero .hero-icon {
            width: 58px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 1px;
            font-size: 1.5rem;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.12);
            color: #8ec5ff;
            box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
        }

        .memorization-hero .hero-subtitle {
            color: rgba(255,255,255,.72);
        }

        .hud-stat-card {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(255,255,255,.08);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
            box-shadow: 0 8px 22px rgba(0,0,0,.12);
        }

        .hud-stat-card .label {
            color: rgba(255,255,255,.65);
            font-size: .85rem;
        }

        .hud-stat-card .value {
            font-size: 1.6rem;
            font-weight: 700;
            line-height: 1.1;
        }

        .hud-soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .7rem;
            border-radius: 999px;
            font-size: .75rem;
            font-weight: 600;
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.82);
            border: 1px solid rgba(255,255,255,.08);
        }

        .card.hud-card {
            border: 1px solid rgba(255,255,255,.08);
            overflow: hidden;
            box-shadow: 0 8px 22px rgba(0,0,0,.10);
        }

        .card.hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.06);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
        }

        .table > :not(caption) > * > * {
            vertical-align: middle;
        }

        .memorization-table thead th {
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .02em;
            white-space: nowrap;
        }

        .student-chip {
            display: inline-flex;
            align-items: center;
            gap: .55rem;
        }

        .student-avatar {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.04);
        }

        .student-avatar-fallback {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            background: rgba(58,123,213,.18);
            color: #9fd0ff;
            border: 2px solid rgba(255,255,255,.08);
        }

        .ayah-range {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .35rem .65rem;
            border-radius: 999px;
            font-weight: 600;
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.07);
        }

        .review-modal .modal-content {
            border-radius: 18px;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.08);
        }

        .progress {
            background-color: rgba(255,255,255,.08);
        }

        .surah-list-table td,
        .surah-list-table th {
            vertical-align: middle;
        }

        .eq-panels { --panel-h: 520px; }

        @media (max-width: 991.98px) {
            .eq-panels { --panel-h: 65vh; }
        }

        .eq-panels .card.equal {
            height: var(--panel-h);
            max-height: var(--panel-h);
            display: flex;
            flex-direction: column;
        }

        .eq-panels .card.equal .card-body {
            flex: 1 1 auto;
            overflow: auto;
        }

        .text-neon {
            color: #a7eefb;
        }

        .audio-meter-wrap {
            width: 100%;
        }

        .audio-meter {
            position: relative;
            width: 100%;
            height: 12px;
            border-radius: 999px;
            overflow: hidden;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: inset 0 1px 2px rgba(0,0,0,.25);
        }

        .audio-meter-bar {
            height: 100%;
            width: 0%;
            border-radius: 999px;
            transition: width .08s linear;
            background: linear-gradient(90deg, #198754 0%, #ffc107 65%, #dc3545 100%);
        }

        .recorder-box {
            min-width: 260px;
            max-width: 320px;
            width: 100%;
            padding: .75rem;
            border-radius: 14px;
            background: rgba(255,255,255,.03);
            border: 1px solid rgba(255,255,255,.06);
        }

        .recorder-status {
            font-size: .82rem;
        }

        .audio-playback-box {
            width: 100%;
            max-width: 320px;
            padding: .65rem;
            border-radius: 14px;
            background: rgba(255,255,255,.03);
            border: 1px solid rgba(255,255,255,.06);
        }

        .audio-playback-box audio,
        .recorder-box audio {
            width: 100% !important;
        }

        .table-note {
            white-space: normal;
            max-width: 260px;
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\memorization\index.blade.php :: @push(css) ===== */

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dataTables_filter input {
            min-width: 240px;
            border-radius: 12px !important;
        }

        .form-select,
        select {
            color: #7cb8ff;
            background-color: transparent !important;
        }

        .memorization-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.08);
            background:
                radial-gradient(circle at top right, rgba(58,123,213,.18), transparent 35%),
                radial-gradient(circle at bottom left, rgba(0,210,255,.10), transparent 30%),
                linear-gradient(135deg, rgba(13,18,31,.96), rgba(20,28,45,.96));
            border-radius: 1px;
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }

        .memorization-hero .hero-icon {
            width: 58px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 1px;
            font-size: 1.5rem;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.12);
            color: #8ec5ff;
            box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
        }

        .memorization-hero .hero-subtitle {
            color: rgba(255,255,255,.72);
        }

        .hud-stat-card {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(255,255,255,.08);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
            box-shadow: 0 8px 22px rgba(0,0,0,.12);
        }

        .hud-stat-card .label {
            color: rgba(255,255,255,.65);
            font-size: .85rem;
        }

        .hud-stat-card .value {
            font-size: 1.6rem;
            font-weight: 700;
            line-height: 1.1;
        }

        .hud-soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .7rem;
            border-radius: 999px;
            font-size: .75rem;
            font-weight: 600;
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.82);
            border: 1px solid rgba(255,255,255,.08);
        }

        .card.hud-card {
            border: 1px solid rgba(255,255,255,.08);
            overflow: hidden;
            box-shadow: 0 8px 22px rgba(0,0,0,.10);
        }

        .card.hud-card .card-header {
            border-bottom: 1px solid rgba(255,255,255,.06);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
        }

        .table > :not(caption) > * > * {
            vertical-align: middle;
        }

        .memorization-table thead th {
            font-size: .82rem;
            text-transform: uppercase;
            letter-spacing: .02em;
            white-space: nowrap;
        }

        .student-chip {
            display: inline-flex;
            align-items: center;
            gap: .55rem;
        }

        .student-avatar {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.04);
        }

        .student-avatar-fallback {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            background: rgba(58,123,213,.18);
            color: #9fd0ff;
            border: 2px solid rgba(255,255,255,.08);
        }

        .ayah-range {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .35rem .65rem;
            border-radius: 999px;
            font-weight: 600;
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.07);
        }

        .review-modal .modal-content {
            border-radius: 18px;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.08);
        }

        .progress {
            background-color: rgba(255,255,255,.08);
        }

        .surah-list-table td,
        .surah-list-table th {
            vertical-align: middle;
        }

        .eq-panels { --panel-h: 520px; }

        @media (max-width: 991.98px) {
            .eq-panels { --panel-h: 65vh; }
        }

        .eq-panels .card.equal {
            height: var(--panel-h);
            max-height: var(--panel-h);
            display: flex;
            flex-direction: column;
        }

        .eq-panels .card.equal .card-body {
            flex: 1 1 auto;
            overflow: auto;
        }

        .text-neon {
            color: #a7eefb;
        }

        .audio-meter-wrap {
            width: 100%;
        }

        .audio-meter {
            position: relative;
            width: 100%;
            height: 12px;
            border-radius: 999px;
            overflow: hidden;
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: inset 0 1px 2px rgba(0,0,0,.25);
        }

        .audio-meter-bar {
            height: 100%;
            width: 0%;
            border-radius: 999px;
            transition: width .08s linear;
            background: linear-gradient(90deg, #198754 0%, #ffc107 65%, #dc3545 100%);
        }

        .recorder-box {
            min-width: 260px;
            max-width: 320px;
            width: 100%;
            padding: .75rem;
            border-radius: 14px;
            background: rgba(255,255,255,.03);
            border: 1px solid rgba(255,255,255,.06);
        }

        .recorder-status {
            font-size: .82rem;
        }

        .audio-playback-box {
            width: 100%;
            max-width: 320px;
            padding: .65rem;
            border-radius: 14px;
            background: rgba(255,255,255,.03);
            border: 1px solid rgba(255,255,255,.06);
        }

        .audio-playback-box audio,
        .recorder-box audio {
            width: 100% !important;
        }

        .table-note {
            white-space: normal;
            max-width: 260px;
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }

/* ===== resources\views\messages\create.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-cyan: #a7eefb;
        }

        .message-create-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .message-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .page-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-section {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            margin-bottom: 1rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .form-control {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.45);
        }

        textarea.form-control {
            min-height: 140px;
        }

        .invalid-feedback {
            display: block;
        }

        .captcha-box {
            border-radius: 18px;
            padding: 1rem;
            background: rgba(250,204,21,.08);
            border: 1px solid rgba(250,204,21,.22);
            color: #fde68a;
            font-weight: 800;
        }

        .summary-pill {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.82);
            font-size: .84rem;
            font-weight: 700;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .message-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .message-actions .btn,
            .message-actions a {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .form-actions {
                flex-direction: column;
            }

            .form-actions .btn,
            .form-actions a {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .message-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\messages\index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .messages-page { width: 100%; overflow-x: hidden; }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * { position: relative; z-index: 2; }

        .messages-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .page-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext { color: var(--hud-muted); }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i { color: var(--hud-cyan); }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            white-space: nowrap;
        }

        .badge-info-soft { border-color: rgba(59,130,246,.24); color: #bfdbfe; }
        .badge-success-soft { border-color: rgba(34,197,94,.24); color: #bbf7d0; }
        .badge-danger-soft { border-color: rgba(239,68,68,.24); color: #fecaca; }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 1100px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover { background: rgba(45,212,191,.06); }

        .comment-cell {
            max-width: 340px;
            white-space: normal;
            word-break: break-word;
        }

        .reply-cell {
            max-width: 300px;
            white-space: normal;
            word-break: break-word;
            color: rgba(255,255,255,.78) !important;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-control::placeholder { color: rgba(255,255,255,.45); }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        textarea.form-control { min-height: 120px; }

        .modal-content {
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45,212,191,.14), transparent 34%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            color: #fff;
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(255,255,255,.10);
        }

        .modal-title {
            color: var(--hud-cyan);
            font-weight: 900;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow { pointer-events: none; }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .messages-topbar,
            .messages-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .messages-actions .btn,
            .messages-actions a,
            .messages-actions button {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .messages-hero { padding: 1rem; }
        }

/* ===== resources\views\messages\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .messages-page { width: 100%; overflow-x: hidden; }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * { position: relative; z-index: 2; }

        .messages-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .page-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext { color: var(--hud-muted); }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i { color: var(--hud-cyan); }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            white-space: nowrap;
        }

        .badge-info-soft { border-color: rgba(59,130,246,.24); color: #bfdbfe; }
        .badge-success-soft { border-color: rgba(34,197,94,.24); color: #bbf7d0; }
        .badge-danger-soft { border-color: rgba(239,68,68,.24); color: #fecaca; }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 1100px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover { background: rgba(45,212,191,.06); }

        .comment-cell {
            max-width: 340px;
            white-space: normal;
            word-break: break-word;
        }

        .reply-cell {
            max-width: 300px;
            white-space: normal;
            word-break: break-word;
            color: rgba(255,255,255,.78) !important;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-control::placeholder { color: rgba(255,255,255,.45); }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        textarea.form-control { min-height: 120px; }

        .modal-content {
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45,212,191,.14), transparent 34%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            color: #fff;
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(255,255,255,.10);
        }

        .modal-title {
            color: var(--hud-cyan);
            font-weight: 900;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow { pointer-events: none; }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .dataTables_wrapper .dataTables_filter input {
            min-height: 40px;
            border-radius: 999px;
            border-color: rgba(255,255,255,.12);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .dataTables_wrapper .dataTables_info,
        .dataTables_wrapper .dataTables_length label {
            color: rgba(255,255,255,.65);
        }

        .dataTables_wrapper .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .dataTables_wrapper .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        @media (max-width: 991.98px) {
            .messages-topbar,
            .messages-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .messages-actions .btn,
            .messages-actions a,
            .messages-actions button {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .messages-hero { padding: 1rem; }
        }

/* ===== resources\views\messages\show.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-cyan: #a7eefb;
        }

        .message-show-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .message-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .page-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .info-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .info-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
            margin-bottom: .35rem;
        }

        .info-value {
            color: #fff;
            font-weight: 700;
            word-break: break-word;
            line-height: 1.6;
        }

        .message-box {
            border-radius: 18px;
            padding: 1.2rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            color: rgba(255,255,255,.88);
            line-height: 1.7;
            min-height: 130px;
            white-space: pre-line;
        }

        .reply-box {
            border-radius: 18px;
            padding: 1.2rem;
            border: 1px solid rgba(34,197,94,.20);
            background: rgba(34,197,94,.08);
            color: rgba(255,255,255,.88);
            line-height: 1.7;
            min-height: 110px;
            white-space: pre-line;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .message-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .message-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .message-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\online-course\index.blade.php :: <style> ===== */

/* ===== DASHBOARD MODERN STYLES ===== */
        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        /* Hero Section */
        .dashboard-hero{
            position:relative;
            overflow:hidden;
            border-radius:1px;
            border:1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .dashboard-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.5rem;
            padding:.6rem 1rem;
            border-radius:8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color:#2dd4bf;
            font-size:.85rem;
            font-weight:700;
            letter-spacing:0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title{
            color:#fff;
            font-weight:800;
            margin-bottom:.5rem;
            font-size:2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle{
            color:rgba(255,255,255,.75);
            margin-bottom:0;
            font-size:1rem;
        }

        /* HUD Card */
        .hud-card{
            border:1px solid rgba(45, 212, 191, 0.2);
            border-radius:1px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            position:relative;
            overflow:hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .hud-card::before{
            content:"";
            position:absolute;
            inset:0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.08), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events:none;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .hud-card .card-body,
        .hud-card .card-header,
        .hud-card .card-footer{
            position:relative;
            z-index:2;
        }

        .hud-card .card-header{
            border-bottom:1px solid rgba(45, 212, 191, 0.1);
            background:transparent;
            padding: 1.25rem !important;
        }

        .hud-title{
            color:#fff;
            font-weight:700;
            text-transform:uppercase;
            letter-spacing:.6px;
            font-size: 0.95rem;
        }

        .hud-soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.45rem .75rem;
            border-radius:8px;
            font-size:.8rem;
            line-height:1;
            border:1px solid rgba(45, 212, 191, 0.3);
            background:rgba(45, 212, 191, 0.1);
            color:#2dd4bf;
            backdrop-filter:blur(10px);
            transition: all 0.3s ease;
        }

        .hud-soft-badge.badge-room{
            background:rgba(250,204,21,.12);
            border-color:rgba(250,204,21,.4);
            color:#fbbf24;
        }

        .hud-soft-badge.badge-success{
            border-color:rgba(34,197,94,.4);
            color:#4ade80;
        }

        .hud-soft-badge.badge-warning{
            border-color:rgba(250,204,21,.4);
            color:#fbbf24;
        }

        .hud-soft-badge.badge-danger{
            border-color:rgba(239,68,68,.4);
            color:#f87171;
        }

        /* Room Items */
        .room-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            padding: 1.5rem;
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 1px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            position: relative;
            overflow: hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .room-item::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.08), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events: none;
        }

        .room-item:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .room-item > * {
            position: relative;
            z-index: 2;
        }

        .room-item-main {
            min-width: 0;
            flex: 1;
        }

        .room-item-title {
            color: #fff;
            font-weight: 700;
            line-height: 1.2;
            font-size: 1.1rem;
        }

        .room-item-meta {
            color: rgba(255,255,255,.62);
            font-size: .84rem;
            margin-top: .25rem;
        }

        .room-item-actions {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: .5rem;
            min-width: 220px;
        }

        .room-stack {
            display: grid;
            gap: 1rem;
        }

        /* Cards General */
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        /* Badge Styles */
        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        /* Button Styles */
        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }

        .text-neon {
            color: #2dd4bf;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
        }

        /* Alert Styles */
        .alert-info {
            background-color: rgba(59, 130, 246, 0.1) !important;
            border-color: rgba(59, 130, 246, 0.3) !important;
            color: #bfdbfe !important;
        }

        .alert-warning {
            background-color: rgba(250, 204, 21, 0.1) !important;
            border-color: rgba(250, 204, 21, 0.3) !important;
            color: #fde68a !important;
        }

        /* Table HUD */
        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.04);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        /* Responsive */
        @media (max-width: 1200px) {
            .dashboard-hero-title {
                font-size: 1.75rem;
            }
        }

        @media (max-width: 767.98px){
            .dashboard-hero {
                border-radius: 1px;
            }

            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .room-item {
                padding: 1.25rem;
                flex-direction: column;
                align-items: stretch;
            }

            .room-item-actions {
                min-width: 100%;
                width: 100%;
                align-items: stretch;
            }

            .room-item-actions .btn {
                width: 100%;
            }

            .card-body {
                padding: 1.25rem !important;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\online-course\index.blade.php :: @push(css) ===== */

/* ===== resources\views\pages\adhkar.blade.php :: <style> ===== */
:root{
            --bg:#0f172a;
            --card:#111827;
            --muted:#9ca3af;
            --text:#e5e7eb;
            --accent:#22d3ee;
            --accent2:#f59e0b;
        }
        *{box-sizing:border-box}
        html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family: system-ui, -apple-system, Segoe UI, Roboto, "Noto Sans", "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";}
        a{color:var(--accent);text-decoration:none}
        .container{max-width:960px;margin:0 auto;padding:24px}
        .header{
            display:flex;align-items:center;gap:16px;flex-wrap:wrap;
            background:linear-gradient(135deg, rgba(34,211,238,.12), rgba(245,158,11,.12));
            border-radius:6px;padding:18px 20px;margin-bottom:18px;border:1px solid rgba(255,255,255,.06);
        }
        .title{font-size:clamp(22px, 4vw, 36px);font-weight:800;letter-spacing:.3px}
        .subtitle{color:var(--muted);font-weight:500}
        .search{display:flex;gap:10px;margin:14px 0 22px}
        .search input{
            width:100%;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.12);
            background:#0b1220;color:var(--text);outline:none
        }
        .tag{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:12px;margin-right:8px}
        .card{
            background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
            border:1px solid rgba(255,255,255,.07);
            border-radius:6px;padding:18px;margin:14px 0;
            box-shadow:0 10px 30px rgba(0,0,0,.25);
        }
        .card h3{margin:0 0 10px;font-size:20px}
        .aria{font-size:22px;line-height:1.75;direction:rtl;text-align:right;margin:10px 0 4px;font-family:"Noto Naskh Arabic", "Amiri", "Scheherazade New", serif;}
        .trl{font-size:15px;opacity:.95;margin:6px 0 8px}
        .tr{font-size:14px;color:var(--muted);margin:6px 0 0}
        .how{font-size:13px;color:var(--muted);margin-top:6px}
        .pill{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(34,211,238,.15);border:1px solid rgba(34,211,238,.35);font-size:12px}
        footer{margin:26px 0 8px;color:var(--muted);font-size:12px;text-align:center}
        .grid{display:grid;grid-template-columns:1fr;gap:14px}
        @media(min-width:780px){.grid{grid-template-columns:1fr 1fr}}
        @media print {
            body{background:white;color:black}
            .card{box-shadow:none;border-color:#bbb}
            .header{background:white;border:0}
            a{color:black;text-decoration:underline}
        }

/* ===== resources\views\pages\adhkar.blade.php :: <style> ===== */
@page {
            size: A5;
            margin: 10mm 10mm 12mm 10mm;
        }
        @media print {
            body{background:white;color:black}
            .container{max-width:none;padding:0}
            .header{background:white;border:0;margin:0 0 8px 0;padding:0}
            .title{color:black}
            .card{border-color:#bbb;box-shadow:none}
        }

/* ===== resources\views\pages\arabic-language.blade.php :: <style> ===== */
.edu-page {
            --ep-radius: 2px;
            --ep-radius-sm: 1px;
            --ep-border: rgba(255,255,255,.08);
            --ep-soft: rgba(255,255,255,.05);
            --ep-shadow: 0 10px 30px rgba(0,0,0,.16);
            --ep-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .edu-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--ep-soft);
            box-shadow: var(--ep-shadow);
        }

        .edu-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .edu-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .edu-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .edu-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--ep-radius);
            border: 1px solid var(--ep-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .edu-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--ep-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .edu-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .edu-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .edu-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .edu-page .full-width-image {
            display: block;
            width: 100%;
            height: auto;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            margin-bottom: 1rem;
        }

        .edu-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .edu-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            flex-shrink: 0;
        }

        .edu-page .book-image {
            width: 100%;
            border-radius: var(--ep-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
        }

        .edu-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 1px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .edu-page .text-justify {
            text-align: justify;
        }

        .edu-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        @media (min-width: 768px) {
            .edu-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .edu-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .edu-page .section-card {
                padding: .9rem;
            }

            .edu-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .edu-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .edu-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .edu-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edu-page h3 { font-size: 1.35rem; }
            .edu-page h4 { font-size: 1.12rem; }
            .edu-page h5 { font-size: 1rem; }

            .edu-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\pages\arabic-language.blade.php :: @push(css) ===== */

        .edu-page {
            --ep-radius: 2px;
            --ep-radius-sm: 1px;
            --ep-border: rgba(255,255,255,.08);
            --ep-soft: rgba(255,255,255,.05);
            --ep-shadow: 0 10px 30px rgba(0,0,0,.16);
            --ep-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .edu-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--ep-soft);
            box-shadow: var(--ep-shadow);
        }

        .edu-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .edu-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .edu-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .edu-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--ep-radius);
            border: 1px solid var(--ep-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .edu-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--ep-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .edu-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .edu-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .edu-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .edu-page .full-width-image {
            display: block;
            width: 100%;
            height: auto;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            margin-bottom: 1rem;
        }

        .edu-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .edu-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            flex-shrink: 0;
        }

        .edu-page .book-image {
            width: 100%;
            border-radius: var(--ep-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
        }

        .edu-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 1px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .edu-page .text-justify {
            text-align: justify;
        }

        .edu-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        @media (min-width: 768px) {
            .edu-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .edu-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .edu-page .section-card {
                padding: .9rem;
            }

            .edu-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .edu-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .edu-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .edu-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edu-page h3 { font-size: 1.35rem; }
            .edu-page h4 { font-size: 1.12rem; }
            .edu-page h5 { font-size: 1rem; }

            .edu-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\pages\cgv.blade.php :: <style> ===== */
.btn-scroll-top{
            position: fixed; right: 1rem; bottom: 1rem; z-index: 1080;
            display: inline-flex; align-items: center; justify-content: center;
            width: 44px; height: 44px; border-radius: 50%;
            background: #0d6efd; color: #fff; text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, transform .2s;
        }
        .btn-scroll-top.show{ opacity: 1; visibility: visible; }
        .btn-scroll-top:hover{ transform: translateY(-2px); }
        .btn-scroll-top i{ font-size: 18px; line-height: 1; }

/* ===== resources\views\pages\cgv.blade.php :: @push(css) ===== */

        .btn-scroll-top{
            position: fixed; right: 1rem; bottom: 1rem; z-index: 1080;
            display: inline-flex; align-items: center; justify-content: center;
            width: 44px; height: 44px; border-radius: 50%;
            background: #0d6efd; color: #fff; text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, transform .2s;
        }
        .btn-scroll-top.show{ opacity: 1; visibility: visible; }
        .btn-scroll-top:hover{ transform: translateY(-2px); }
        .btn-scroll-top i{ font-size: 18px; line-height: 1; }

/* ===== resources\views\pages\cookies.blade.php :: <style> ===== */
._CookieScriptReportPageTable {
            font-family: Chakra Petch, sans-serif !important;
            font-size: 14px !important;
        }

         :root{
             --cs-accent: #99cccc; /* reprend ta vague */
         }

        /* page spacing */
        .cookie-page{
            padding-top: 1.25rem;
            padding-bottom: 2.5rem;
        }

        /* card width & alignment */
        .cookie-card{
            max-width: 1080px;
            margin: 0 auto;
            border-radius: 2px;
            overflow: hidden;
        }

        /* header area (hero) */
        .cookie-hero{
            position: relative;
            background: linear-gradient(180deg, rgba(153,204,204,.18), rgba(153,204,204,0));
        }

        .cookie-hero .card-body{
            padding: 2.25rem 2rem;
        }

        @media (max-width: 576px){
            .cookie-hero .card-body{
                padding: 1.75rem 1.25rem;
            }
        }

        .cookie-title{
            letter-spacing: .2px;
            font-weight: 700;
            margin-bottom: .25rem;
        }

        .cookie-subtitle{
            font-size: .95rem;
            opacity: .8;
        }

        /* nicer section titles */
        .cookie-section h4{
            font-weight: 700;
            margin-bottom: .5rem;
        }
        .cookie-section h5{
            font-weight: 600;
            margin-bottom: 1rem;
            opacity: .9;
        }

        /* CookieScript report: keep it readable + prevent overflow */
        .cookie-report{
            border: 1px solid rgba(255,255,255,.12);
            border-radius: 14px;
            padding: 1rem;
            overflow: auto; /* crucial on mobile */
            background: rgba(0,0,0,.06);
        }

        /* force consistent font for the injected table */
        .cookie-report ._CookieScriptReportPageTable,
        .cookie-report ._CookieScriptReportPageTable *{
            font-family: "Chakra Petch", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
            font-size: 14px !important;
            line-height: 1.45 !important;
        }

        /* small improvements if the table has long strings */
        .cookie-report table{
            min-width: 760px; /* avoids broken columns */
        }

        /* wave color uses accent */
        .cookie-wave path{
            fill: var(--cs-accent);
        }

/* ===== resources\views\pages\cot_insert.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        body {
            background: linear-gradient(135deg, rgba(15,23,42,.95), rgba(30,41,59,.85));
            color: #fff;
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .card-body {
            padding: 1.5rem !important;
            color: #fff;
        }

        .card-title {
            color: #fff;
            font-weight: 700;
        }

        .card-footer {
            background: transparent !important;
            border-top: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1rem !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
            padding: .875rem 2.25rem .875rem .875rem !important;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .input-group-text {
            background: rgba(45, 212, 191, 0.1) !important;
            border-color: rgba(45, 212, 191, 0.2) !important;
            color: #2dd4bf;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .alert {
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(15, 23, 42, 0.6);
            color: #fff;
            border-radius: 12px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-success {
            border-color: rgba(34, 197, 94, 0.3);
            background: rgba(15, 23, 42, 0.6);
        }

        .alert-danger {
            border-color: rgba(239, 68, 68, 0.3);
            background: rgba(15, 23, 42, 0.6);
        }

        .alert-dismissible .btn-close {
            filter: invert(1);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .94rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table a {
            color: #2dd4bf;
            text-decoration: none;
        }

        .table a:hover {
            color: #a78bfa;
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .text-success {
            color: #4ade80 !important;
        }

        .bg-soft-success {
            background: rgba(34, 197, 94, 0.15) !important;
            border: 1px solid rgba(34, 197, 94, 0.3);
            border-radius: 12px;
            padding: 1rem;
            animation: fadeInUp 0.6s ease-out;
        }

        .bg-soft-danger {
            background: rgba(239, 68, 68, 0.15) !important;
            border: 1px solid rgba(239, 68, 68, 0.3);
            border-radius: 12px;
            padding: 1rem;
            animation: fadeInUp 0.6s ease-out;
        }

        .cotdue {
            color: #fff;
        }

        .text-yellow {
            color: #fbbf24 !important;
        }

        .btn-link {
            color: #2dd4bf;
            text-decoration: none;
        }

        .btn-link:hover {
            color: #a78bfa;
        }

        .collapse {
            animation: fadeInUp 0.4s ease-out;
        }

        .text-danger {
            color: #f87171 !important;
        }

        @media (max-width: 768px) {
            .card {
                margin-bottom: 1rem;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.95rem;
            }

            .btn-primary {
                width: 100%;
            }
        }

/* ===== resources\views\pages\cot_insert.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        body {
            background: linear-gradient(135deg, rgba(15,23,42,.95), rgba(30,41,59,.85));
            color: #fff;
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .card-body {
            padding: 1.5rem !important;
            color: #fff;
        }

        .card-title {
            color: #fff;
            font-weight: 700;
        }

        .card-footer {
            background: transparent !important;
            border-top: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1rem !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a;
        }

        .btn-primary:hover {
            color: #fff;
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
            padding: .875rem 2.25rem .875rem .875rem !important;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .input-group-text {
            background: rgba(45, 212, 191, 0.1) !important;
            border-color: rgba(45, 212, 191, 0.2) !important;
            color: #2dd4bf;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .alert {
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(15, 23, 42, 0.6);
            color: #fff;
            border-radius: 12px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-success {
            border-color: rgba(34, 197, 94, 0.3);
            background: rgba(15, 23, 42, 0.6);
        }

        .alert-danger {
            border-color: rgba(239, 68, 68, 0.3);
            background: rgba(15, 23, 42, 0.6);
        }

        .alert-dismissible .btn-close {
            filter: invert(1);
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .94rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table a {
            color: #2dd4bf;
            text-decoration: none;
        }

        .table a:hover {
            color: #a78bfa;
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .text-success {
            color: #4ade80 !important;
        }

        .bg-soft-success {
            background: rgba(34, 197, 94, 0.15) !important;
            border: 1px solid rgba(34, 197, 94, 0.3);
            border-radius: 12px;
            padding: 1rem;
            animation: fadeInUp 0.6s ease-out;
        }

        .bg-soft-danger {
            background: rgba(239, 68, 68, 0.15) !important;
            border: 1px solid rgba(239, 68, 68, 0.3);
            border-radius: 12px;
            padding: 1rem;
            animation: fadeInUp 0.6s ease-out;
        }

        .cotdue {
            color: #fff;
        }

        .text-yellow {
            color: #fbbf24 !important;
        }

        .btn-link {
            color: #2dd4bf;
            text-decoration: none;
        }

        .btn-link:hover {
            color: #a78bfa;
        }

        .collapse {
            animation: fadeInUp 0.4s ease-out;
        }

        .text-danger {
            color: #f87171 !important;
        }

        @media (max-width: 768px) {
            .card {
                margin-bottom: 1rem;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.95rem;
            }

            .btn-primary {
                width: 100%;
            }
        }

/* ===== resources\views\pages\cot_insert_old.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-border-strong: rgba(45, 212, 191, .45);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
            --hud-danger: #ef4444;
            --hud-warning: #f59e0b;
        }

        .contribution-page {
            padding-bottom: 3rem;
        }

        .hud-hero,
        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .13), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-hero::before,
        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .hud-hero {
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .hud-title {
            color: var(--hud-text);
            font-size: 1.5rem;
            font-weight: 600;
            margin: 1rem 0 .35rem;
        }

        .hud-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .hud-card {
            height: 100%;
        }

        .hud-card-header {
            position: relative;
            z-index: 2;
            padding: 1.1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
        }

        .hud-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: 0;
        }

        .hud-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .hud-card-footer {
            position: relative;
            z-index: 2;
            padding: 1rem 1.25rem;
            border-top: 1px solid rgba(148, 163, 184, .14);
            color: var(--hud-muted);
            font-size: .85rem;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .hud-select,
        .form-control,
        .form-select {
            border-radius: 14px;
            padding: .7rem .8rem;
            color: #f8fafc;

            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
        }

        .hud-select:focus,
        .form-control:focus,
        .form-select:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .payment-summary {
            padding: 1rem;
            border-radius: 20px;
            border: 1px solid rgba(148, 163, 184, .16);
            background: rgba(15, 23, 42, .70);
        }

        .payment-summary.is-paid {
            border-color: rgba(34, 197, 94, .35);
            background: rgba(34, 197, 94, .10);
        }

        .payment-summary.is-due {
            border-color: rgba(239, 68, 68, .35);
            background: rgba(239, 68, 68, .10);
        }

        .payment-summary-label {
            color: var(--hud-muted);
            font-size: .85rem;
            font-weight: 700;
        }

        .payment-summary-value {
            color: var(--hud-text);
            font-size: 1.35rem;
            font-weight: 900;
        }

        .payment-summary-due {
            color: #fecaca;
            font-weight: 800;
        }

        .profile-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

        .profile-list li {
            display: flex;
            gap: .65rem;
            padding: .45rem 0;
            color: rgba(248, 250, 252, .82);
            border-bottom: 1px solid rgba(148, 163, 184, .10);
        }

        .profile-list li:last-child {
            border-bottom: 0;
        }

        .profile-list i {
            color: var(--hud-neon);
            margin-top: .2rem;
        }

        .profile-avatar {
            width: 100%;
            max-height: 260px;
            object-fit: cover;
            border-radius: 22px;
            border: 1px solid rgba(45, 212, 191, .25);
            background: rgba(15, 23, 42, .85);
            padding: .25rem;
        }

        .contrib-mini-card {
            border-radius: 18px;
            border: 1px solid rgba(148, 163, 184, .16);
            background: rgba(15, 23, 42, .64);
            overflow: hidden;
        }

        .contrib-mini-card + .contrib-mini-card {
            margin-top: .85rem;
        }

        .contrib-mini-card-body {
            padding: 1rem;
        }

        .expected-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .4rem .7rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 800;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .amount-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .35rem .65rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 900;
        }

        .mode-pill {
            display: inline-flex;
            padding: .3rem .6rem;
            border-radius: 999px;
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            font-weight: 700;
        }

        .invoice-box {
            margin-top: 1rem;
            padding: 1rem;
            border-radius: 18px;
            background: rgba(15, 23, 42, .68);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .alert-modern-success {
            border-radius: 18px;
            color: #d1fae5;
            background: rgba(34, 197, 94, .12);
            border: 1px solid rgba(34, 197, 94, .28);
        }

        .alert-modern-danger {
            border-radius: 18px;
            color: #fecaca;
            background: rgba(239, 68, 68, .12);
            border: 1px solid rgba(239, 68, 68, .28);
        }

        .text-muted {
            color: rgba(226, 232, 240, .62) !important;
        }

        @media (max-width: 767.98px) {
            .hud-hero,
            .hud-card-header,
            .hud-card-body,
            .hud-card-footer {
                padding: 1rem;
            }

            .hud-hero,
            .hud-card {
                border-radius: 22px;
            }
        }

/* ===== resources\views\pages\cot_insert_old.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(7, 16, 28, .92);
            --hud-panel: rgba(15, 23, 42, .78);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-border-strong: rgba(45, 212, 191, .45);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
            --hud-danger: #ef4444;
            --hud-warning: #f59e0b;
        }

        .contribution-page {
            padding-bottom: 3rem;
        }

        .hud-hero,
        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .13), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .hud-hero::before,
        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
            z-index: 0;
        }

        .hud-content {
            position: relative;
            z-index: 2;
        }

        .hud-hero {
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .hud-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .hud-title {
            color: var(--hud-text);
            font-size: 1.5rem;
            font-weight: 600;
            margin: 1rem 0 .35rem;
        }

        .hud-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .hud-card {
            height: 100%;
        }

        .hud-card-header {
            position: relative;
            z-index: 2;
            padding: 1.1rem 1.25rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
        }

        .hud-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: 0;
        }

        .hud-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .hud-card-footer {
            position: relative;
            z-index: 2;
            padding: 1rem 1.25rem;
            border-top: 1px solid rgba(148, 163, 184, .14);
            color: var(--hud-muted);
            font-size: .85rem;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .hud-select,
        .form-control,
        .form-select {
            border-radius: 14px;
            padding: .7rem .8rem;
            color: #f8fafc;

            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
        }

        .hud-select:focus,
        .form-control:focus,
        .form-select:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .payment-summary {
            padding: 1rem;
            border-radius: 20px;
            border: 1px solid rgba(148, 163, 184, .16);
            background: rgba(15, 23, 42, .70);
        }

        .payment-summary.is-paid {
            border-color: rgba(34, 197, 94, .35);
            background: rgba(34, 197, 94, .10);
        }

        .payment-summary.is-due {
            border-color: rgba(239, 68, 68, .35);
            background: rgba(239, 68, 68, .10);
        }

        .payment-summary-label {
            color: var(--hud-muted);
            font-size: .85rem;
            font-weight: 700;
        }

        .payment-summary-value {
            color: var(--hud-text);
            font-size: 1.35rem;
            font-weight: 900;
        }

        .payment-summary-due {
            color: #fecaca;
            font-weight: 800;
        }

        .profile-list {
            list-style: none;
            padding-left: 0;
            margin-bottom: 0;
        }

        .profile-list li {
            display: flex;
            gap: .65rem;
            padding: .45rem 0;
            color: rgba(248, 250, 252, .82);
            border-bottom: 1px solid rgba(148, 163, 184, .10);
        }

        .profile-list li:last-child {
            border-bottom: 0;
        }

        .profile-list i {
            color: var(--hud-neon);
            margin-top: .2rem;
        }

        .profile-avatar {
            width: 100%;
            max-height: 260px;
            object-fit: cover;
            border-radius: 22px;
            border: 1px solid rgba(45, 212, 191, .25);
            background: rgba(15, 23, 42, .85);
            padding: .25rem;
        }

        .contrib-mini-card {
            border-radius: 18px;
            border: 1px solid rgba(148, 163, 184, .16);
            background: rgba(15, 23, 42, .64);
            overflow: hidden;
        }

        .contrib-mini-card + .contrib-mini-card {
            margin-top: .85rem;
        }

        .contrib-mini-card-body {
            padding: 1rem;
        }

        .expected-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .4rem .7rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 800;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .amount-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .35rem .65rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 900;
        }

        .mode-pill {
            display: inline-flex;
            padding: .3rem .6rem;
            border-radius: 999px;
            color: rgba(248, 250, 252, .86);
            background: rgba(255, 255, 255, .07);
            font-weight: 700;
        }

        .invoice-box {
            margin-top: 1rem;
            padding: 1rem;
            border-radius: 18px;
            background: rgba(15, 23, 42, .68);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .alert-modern-success {
            border-radius: 18px;
            color: #d1fae5;
            background: rgba(34, 197, 94, .12);
            border: 1px solid rgba(34, 197, 94, .28);
        }

        .alert-modern-danger {
            border-radius: 18px;
            color: #fecaca;
            background: rgba(239, 68, 68, .12);
            border: 1px solid rgba(239, 68, 68, .28);
        }

        .text-muted {
            color: rgba(226, 232, 240, .62) !important;
        }

        @media (max-width: 767.98px) {
            .hud-hero,
            .hud-card-header,
            .hud-card-body,
            .hud-card-footer {
                padding: 1rem;
            }

            .hud-hero,
            .hud-card {
                border-radius: 22px;
            }
        }

/* ===== resources\views\pages\crs-coran.blade.php :: <style> ===== */
.learning-page {
            --lp-radius: 3px;
            --lp-radius-sm: 1px;
            --lp-border: rgba(255,255,255,.10);
            --lp-border-soft: rgba(255,255,255,.06);
            --lp-glow: 0 0 0 1px rgba(153, 204, 204, .10), 0 10px 30px rgba(0,0,0,.18);
            --lp-glow-hover: 0 0 0 1px rgba(153, 204, 204, .18), 0 16px 40px rgba(0,0,0,.24);
        }

        .learning-page .learning-card {
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid var(--lp-border-soft);
            box-shadow: var(--lp-glow);
            backdrop-filter: blur(4px);
        }

        .learning-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .learning-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.03), transparent 70%);
            pointer-events: none;
        }

        .learning-page .wave svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .learning-page .section-block {
            height: 100%;
            padding: 1rem;
            border-radius: var(--lp-radius);
            border: 1px solid var(--lp-border-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .learning-page .section-block:hover {
            transform: translateY(-2px);
            box-shadow: var(--lp-glow-hover);
            border-color: rgba(153, 204, 204, .18);
        }

        .learning-page .section-block p:last-child {
            margin-bottom: 0;
        }

        .learning-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .learning-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 4px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .learning-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .learning-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .learning-page .media-image {
            width: 100%;
            max-width: 240px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--lp-radius-sm);
            flex-shrink: 0;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
            background: rgba(255,255,255,.02);
        }

        .learning-page .media-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
            filter: brightness(1.02);
        }

        .learning-page .book-image {
            width: 100%;
            border-radius: var(--lp-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease;
        }

        .learning-page .book-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
        }

        .learning-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: .1rem;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .learning-page .price-box .h4 {
            letter-spacing: .02em;
        }

        .learning-page .cta-wrap .btn {
            min-width: 220px;
            border-radius: 4px;
            box-shadow: 0 8px 20px rgba(0,0,0,.14);
        }

        .learning-page .btn-success {
            box-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 8px 18px rgba(25,135,84,.25);
        }

        .learning-page .btn-success:hover {
            transform: translateY(-1px);
        }

        .learning-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        .learning-page .card-arrow > div {
            opacity: .9;
        }

        .learning-page .text-justify {
            text-align: justify;
        }

        .learning-page .premium-modal .modal-content {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 1rem;
            overflow: hidden;
            box-shadow: 0 16px 45px rgba(0,0,0,.28);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
            backdrop-filter: blur(6px);
        }

        .learning-page .premium-modal .modal-header,
        .learning-page .premium-modal .modal-footer {
            border-color: rgba(255,255,255,.08);
        }

        .learning-page .premium-modal .modal-title i {
            color: #99cccc;
        }

        @media (min-width: 768px) {
            .learning-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .learning-page .card-body.p-3.p-md-4 {
                padding: 1rem !important;
            }

            .learning-page .section-block {
                padding: .9rem;
            }

            .learning-page .media-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .learning-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .learning-page .text-justify {
                text-align: right;
            }

            .learning-page .cta-wrap .btn {
                width: 100%;
                min-width: 0;
            }
        }

        @media (max-width: 575.98px) {
            .learning-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .learning-page .price-box {
                padding: .9rem;
            }

            .learning-page h3 {
                font-size: 1.35rem;
            }

            .learning-page h4 {
                font-size: 1.15rem;
            }

            .learning-page h5 {
                font-size: 1.02rem;
            }

            .learning-page .modal-body .fs-5 {
                font-size: 1rem !important;
            }
        }

/* ===== resources\views\pages\crs-coran.blade.php :: @push(css) ===== */

        .learning-page {
            --lp-radius: 3px;
            --lp-radius-sm: 1px;
            --lp-border: rgba(255,255,255,.10);
            --lp-border-soft: rgba(255,255,255,.06);
            --lp-glow: 0 0 0 1px rgba(153, 204, 204, .10), 0 10px 30px rgba(0,0,0,.18);
            --lp-glow-hover: 0 0 0 1px rgba(153, 204, 204, .18), 0 16px 40px rgba(0,0,0,.24);
        }

        .learning-page .learning-card {
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid var(--lp-border-soft);
            box-shadow: var(--lp-glow);
            backdrop-filter: blur(4px);
        }

        .learning-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .learning-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.03), transparent 70%);
            pointer-events: none;
        }

        .learning-page .wave svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .learning-page .section-block {
            height: 100%;
            padding: 1rem;
            border-radius: var(--lp-radius);
            border: 1px solid var(--lp-border-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .learning-page .section-block:hover {
            transform: translateY(-2px);
            box-shadow: var(--lp-glow-hover);
            border-color: rgba(153, 204, 204, .18);
        }

        .learning-page .section-block p:last-child {
            margin-bottom: 0;
        }

        .learning-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .learning-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 4px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .learning-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .learning-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .learning-page .media-image {
            width: 100%;
            max-width: 240px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--lp-radius-sm);
            flex-shrink: 0;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
            background: rgba(255,255,255,.02);
        }

        .learning-page .media-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
            filter: brightness(1.02);
        }

        .learning-page .book-image {
            width: 100%;
            border-radius: var(--lp-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease;
        }

        .learning-page .book-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
        }

        .learning-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: .1rem;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .learning-page .price-box .h4 {
            letter-spacing: .02em;
        }

        .learning-page .cta-wrap .btn {
            min-width: 220px;
            border-radius: 4px;
            box-shadow: 0 8px 20px rgba(0,0,0,.14);
        }

        .learning-page .btn-success {
            box-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 8px 18px rgba(25,135,84,.25);
        }

        .learning-page .btn-success:hover {
            transform: translateY(-1px);
        }

        .learning-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        .learning-page .card-arrow > div {
            opacity: .9;
        }

        .learning-page .text-justify {
            text-align: justify;
        }

        .learning-page .premium-modal .modal-content {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 1rem;
            overflow: hidden;
            box-shadow: 0 16px 45px rgba(0,0,0,.28);
            background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
            backdrop-filter: blur(6px);
        }

        .learning-page .premium-modal .modal-header,
        .learning-page .premium-modal .modal-footer {
            border-color: rgba(255,255,255,.08);
        }

        .learning-page .premium-modal .modal-title i {
            color: #99cccc;
        }

        @media (min-width: 768px) {
            .learning-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .learning-page .card-body.p-3.p-md-4 {
                padding: 1rem !important;
            }

            .learning-page .section-block {
                padding: .9rem;
            }

            .learning-page .media-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .learning-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .learning-page .text-justify {
                text-align: right;
            }

            .learning-page .cta-wrap .btn {
                width: 100%;
                min-width: 0;
            }
        }

        @media (max-width: 575.98px) {
            .learning-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .learning-page .price-box {
                padding: .9rem;
            }

            .learning-page h3 {
                font-size: 1.35rem;
            }

            .learning-page h4 {
                font-size: 1.15rem;
            }

            .learning-page h5 {
                font-size: 1.02rem;
            }

            .learning-page .modal-body .fs-5 {
                font-size: 1rem !important;
            }
        }

/* ===== resources\views\pages\email_connexion.blade.php :: <style> ===== */
body, table, td, a { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
        table, td { mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; }
        img { -ms-interpolation-mode:bicubic; border:0; outline:none; text-decoration:none; }
        a { text-decoration:none; }

        .arabic {
            direction: rtl;
            text-align: right;
            font-family: Tahoma, Arial, sans-serif;
        }

        @media screen and (max-width: 640px) {
            .container { width:100% !important; }
            .px { padding-left:16px !important; padding-right:16px !important; }
            .py { padding-top:16px !important; padding-bottom:16px !important; }
            .stack { display:block !important; width:100% !important; }
            .metric-box { display:block !important; width:100% !important; }
            .metric-gap { display:block !important; height:12px !important; }
            .btn { width:100% !important; display:block !important; text-align:center !important; }
            .text-center-mobile { text-align:center !important; }

            td[class="metric-box"] {
                padding-left:0 !important;
                padding-right:0 !important;
            }

            p {
                font-size:16px !important;
            }
        }

/* ===== resources\views\pages\index.blade.php :: <style> ===== */
html, body {
            overflow-x: hidden;
        }

        .page-wrapper-guest {
            overflow-x: hidden;
            width: 100%;
        }
        @media (min-width: 1660px) {
            .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
                max-width: 1320px;
            }
        }

        .btn-scroll-top {
            position: fixed;
            right: 1rem;
            bottom: 1rem;
            z-index: 1080;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: #0d6efd;
            color: #fff;
            text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0;
            visibility: hidden;
            transition: opacity .2s, visibility .2s, transform .2s;
        }

        .btn-scroll-top.show {
            opacity: 1;
            visibility: visible;
        }

        .btn-scroll-top:hover {
            transform: translateY(-2px);
        }

        .btn-scroll-top i {
            font-size: 16px;
            line-height: 1;
        }

        .hero-payment-icons i {
            margin: .25rem;
        }

        .move-image {
            max-width: 100%;
            height: auto;
            object-fit: contain;
        }

        /* Hero Section - Fullscreen Background */
        #home {
            min-height: 100vh;
            overflow: hidden;
        }

        .hover-card {
            transition: transform .2s ease, box-shadow .2s ease;
        }

        .hover-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 25px rgba(0,0,0,.08);
        }

        .text-break-all,
        .text-break-all a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .gallery-card img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }

        .contact-info-block p,
        .contact-info-block a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .form-control,
        textarea {
            min-width: 0;
        }

        /* =========================
           RTL / ARABIC GLOBAL FIXES
        ========================== */
        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page,
        .rtl-page .offcanvas,
        .rtl-page .modal-content,
        .rtl-page .card,
        .rtl-page .form-control,
        .rtl-page .form-label,
        .rtl-page .alert,
        .rtl-page .btn,
        .rtl-page .dropdown-menu {
            direction: rtl;
        }

        .rtl-page h1,
        .rtl-page h2,
        .rtl-page h3,
        .rtl-page h4,
        .rtl-page h5,
        .rtl-page h6,
        .rtl-page p,
        .rtl-page li,
        .rtl-page .lead,
        .rtl-page .text-muted,
        .rtl-page .form-label,
        .rtl-page .card-body,
        .rtl-page .modal-body,
        .rtl-page .modal-header,
        .rtl-page .modal-footer,
        .rtl-page .offcanvas-body,
        .rtl-page .offcanvas-header,
        .rtl-page .offcanvas-footer {
            text-align: right;
        }

        .rtl-page .form-control,
        .rtl-page textarea,
        .rtl-page input {
            text-align: right;
        }

        .rtl-page .list-inline {
            display: flex;
            flex-wrap: wrap;
            gap: .75rem;
            justify-content: flex-end;
            padding-right: 0;
            margin-bottom: .5rem;
        }

        .rtl-page .list-inline-item {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .rtl-page ul.list-unstyled {
            padding-right: 0;
            margin-bottom: 0;
        }

        .rtl-page .hero-text {
            text-align: right !important;
        }

        .rtl-page .hero-buttons-wrap {
            justify-content: flex-end !important;
        }

        .rtl-page .hero-payment-icons {
            text-align: right !important;
        }

        .rtl-page .d-flex.align-items-center.flex-row-adapt,
        .rtl-page .info-row {
            flex-direction: row-reverse;
        }

        .rtl-page .me-1,
        .rtl-page .me-2,
        .rtl-page .me-3,
        .rtl-page .me-4,
        .rtl-page .me-5 {
            margin-right: 0 !important;
        }

        .rtl-page .ms-1,
        .rtl-page .ms-2,
        .rtl-page .ms-3,
        .rtl-page .ms-4,
        .rtl-page .ms-5 {
            margin-left: 0 !important;
        }

        .rtl-page .me-1 { margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-left: .5rem !important; }
        .rtl-page .me-3 { margin-left: 1rem !important; }
        .rtl-page .me-4 { margin-left: 1.5rem !important; }
        .rtl-page .me-5 { margin-left: 3rem !important; }

        .rtl-page .ms-1 { margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-right: .5rem !important; }
        .rtl-page .ms-3 { margin-right: 1rem !important; }
        .rtl-page .ms-4 { margin-right: 1.5rem !important; }
        .rtl-page .ms-5 { margin-right: 3rem !important; }

        .rtl-page .offcanvas-start {
            left: auto !important;
            right: 0 !important;
            transform: translateX(100%);
        }

        .rtl-page .offcanvas.show:not(.hiding),
        .rtl-page .offcanvas.showing {
            transform: none;
        }

        .rtl-page .contact-buttons,
        .rtl-page .auto-reg-actions,
        .rtl-page .modal-footer-flex {
            flex-direction: row-reverse;
        }

        .rtl-page .social-link-badge {
            justify-content: flex-end;
        }

        /* =========================
           CONTAINER FIXES (Boxed Layout)
        ========================== */
        /* Laisse Bootstrap gérer les conteneurs avec des max-width appropriés */
        .page-wrapper-guest .container,
        .page-wrapper-guest .container-sm,
        .page-wrapper-guest .container-md,
        .page-wrapper-guest .container-lg,
        .page-wrapper-guest .container-xl,
        .page-wrapper-guest .container-xxl {
            margin-left: auto;
            margin-right: auto;
        }

        /* =========================
           MOBILE FIXES
        ========================== */
        @media (max-width: 991.98px) {
            .page-wrapper-guest .container,
            .page-wrapper-guest .container-sm,
            .page-wrapper-guest .container-md,
            .page-wrapper-guest .container-lg,
            .page-wrapper-guest .container-xl,
            .page-wrapper-guest .container-xxl {
                padding-left: 1rem !important;
                padding-right: 1rem !important;
            }

            .hero-title {
                font-size: 1.9rem;
                line-height: 1.45;
            }

            .hero-text {
                font-size: 1rem !important;
                line-height: 1.8;
                text-align: start !important;
            }

            .rtl-page .hero-text {
                text-align: right !important;
            }

            .hero-buttons-wrap {
                display: block !important;
                width: 100%;
            }

            .hero-buttons-group {
                display: flex !important;
                flex-direction: column !important;
                width: 100%;
                gap: .75rem !important;
            }

            .hero-buttons-group .btn {
                width: 100%;
            }

            .stats-row .d-flex {
                align-items: flex-start !important;
            }

            .pricing-switch .nav {
                flex-wrap: wrap;
                justify-content: center;
            }

            .contact-buttons,
            .auto-reg-actions,
            .modal-footer-flex {
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .contact-buttons .btn,
            .auto-reg-actions .btn,
            .modal-footer-flex .btn {
                width: 100%;
            }

            .form-actions-stack {
                display: flex !important;
                flex-direction: column !important;
                gap: .75rem !important;
            }

            .form-actions-stack > * {
                width: 100%;
            }

            .hero-payment-icons {
                text-align: center !important;
            }

            .rtl-page .hero-payment-icons {
                text-align: right !important;
            }

            .gallery-card .card-body {
                padding: 1rem;
            }

            .badge.rounded-pill {
                white-space: normal;
                line-height: 1.5;
            }

            .info-links-wrap {
                flex-direction: column;
                align-items: stretch !important;
            }

            .info-links-wrap a {
                width: 100%;
                justify-content: center;
            }

            .rtl-page .info-links-wrap a {
                justify-content: center;
            }
        }

        @media (max-width: 575.98px) {
            .hero-title {
                font-size: 1.7rem;
            }

            .lead,
            p,
            li,
            .form-label,
            .form-text {
                font-size: .95rem;
                line-height: 1.8;
            }

            .display-6 {
                font-size: 1.7rem;
            }
        }

        /* =========================
   HOME ANNOUNCEMENT POPUP
========================== */
        .announcement-popup-modal .modal-content {
            border: 1px solid rgba(255,255,255,.08);
            background: linear-gradient(180deg, #1c1d22 0%, #141519 100%);
            color: #fff;
            border-radius: 3px;
            overflow: hidden;
            box-shadow: 0 20px 60px rgba(0,0,0,.45);
        }

        .announcement-popup-modal .modal-header,
        .announcement-popup-modal .modal-footer {
            border-color: rgba(255,255,255,.08);
        }

        .announcement-popup-modal .btn-close {
            filter: invert(1) grayscale(100%);
        }

        .announcement-popup-cover {
            width: 100%;
            height: auto;
            object-fit: contain; /* important */
            border-radius: 2px;
        }

        .announcement-popup-type {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            font-size: .82rem;
            font-weight: 700;
            letter-spacing: .2px;
            border: 1px solid rgba(255,255,255,.08);
        }

        .announcement-popup-type.type-info      { background: rgba(13,110,253,.16); color: #8ec5ff; }
        .announcement-popup-type.type-reunion   { background: rgba(111,66,193,.18); color: #c7a6ff; }
        .announcement-popup-type.type-vacances  { background: rgba(25,135,84,.18); color: #7ee2a8; }
        .announcement-popup-type.type-absence   { background: rgba(255,193,7,.18); color: #ffd86b; }
        .announcement-popup-type.type-travaux   { background: rgba(253,126,20,.18); color: #ffb16b; }
        .announcement-popup-type.type-programme { background: rgba(32,201,151,.18); color: #88f0d0; }
        .announcement-popup-type.type-livres    { background: rgba(13,202,240,.18); color: #86eaff; }
        .announcement-popup-type.type-urgence   { background: rgba(220,53,69,.18); color: #ff98a3; }

        .announcement-popup-excerpt {
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.06);
            border-radius: 12px;
            padding: 1rem;
            color: rgba(255,255,255,.92);
        }

        .announcement-popup-body {
            line-height: 1.85;
            color: rgba(255,255,255,.88);
        }

        .announcement-popup-date {
            color: rgba(255,255,255,.60);
            font-size: .92rem;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

        .btn-registration-cta {
            font-weight: 800;
            padding: 0.75rem 1.4rem;
            box-shadow: 0 0 18px rgba(0, 224, 255, 0.35);
        }

        @media (max-width: 576px) {
            .announcement-popup-modal .modal-dialog {
                margin: 0.5rem;
            }

            .announcement-popup-modal .modal-content {
                border-radius: 18px;
            }

            .announcement-popup-modal .modal-header {
                padding: 1rem;
            }

            .announcement-popup-modal .modal-body {
                padding: 1rem;
            }

            .announcement-popup-excerpt {
                font-size: 1rem !important;
                line-height: 1.35;
            }

            .announcement-popup-body {
                font-size: 0.95rem;
                line-height: 1.5;
            }

            .modal-footer-flex {
                flex-direction: column;
                align-items: stretch;
                gap: 0.75rem;
            }

            .modal-footer-flex .btn {
                width: 100%;
                justify-content: center;
            }

            .btn-registration-cta {
                font-size: 1.05rem;
                padding: 0.85rem 1rem;
            }
        }
        .hero-quran-image {
            max-width: 560px;
            width: 100%;
            height: auto;
            object-fit: contain;
            position: relative;
            z-index: 3;
            opacity: 1 !important;
            visibility: visible !important;
        }

        @media (max-width: 991.98px) {
            .hero-quran-image {
                max-width: 360px;
                margin-top: 1.5rem;
            }
        }

        @media (max-width: 991.98px) {
            .hero-image-desktop {
                display: none !important;
            }
        }

        @media (min-width: 992px) {
            .hero-image-desktop {
                display: flex !important;
            }
        }

/* ===== resources\views\pages\index.blade.php :: @push(css) ===== */

        html, body {
            overflow-x: hidden;
        }

        .page-wrapper-guest {
            overflow-x: hidden;
            width: 100%;
        }
        @media (min-width: 1660px) {
            .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
                max-width: 1320px;
            }
        }

        .btn-scroll-top {
            position: fixed;
            right: 1rem;
            bottom: 1rem;
            z-index: 1080;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: #0d6efd;
            color: #fff;
            text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0;
            visibility: hidden;
            transition: opacity .2s, visibility .2s, transform .2s;
        }

        .btn-scroll-top.show {
            opacity: 1;
            visibility: visible;
        }

        .btn-scroll-top:hover {
            transform: translateY(-2px);
        }

        .btn-scroll-top i {
            font-size: 16px;
            line-height: 1;
        }

        .hero-payment-icons i {
            margin: .25rem;
        }

        .move-image {
            max-width: 100%;
            height: auto;
            object-fit: contain;
        }

        /* Hero Section - Fullscreen Background */
        #home {
            min-height: 100vh;
            overflow: hidden;
        }

        .hover-card {
            transition: transform .2s ease, box-shadow .2s ease;
        }

        .hover-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 25px rgba(0,0,0,.08);
        }

        .text-break-all,
        .text-break-all a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .gallery-card img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }

        .contact-info-block p,
        .contact-info-block a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .form-control,
        textarea {
            min-width: 0;
        }

        /* =========================
           RTL / ARABIC GLOBAL FIXES
        ========================== */
        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page,
        .rtl-page .offcanvas,
        .rtl-page .modal-content,
        .rtl-page .card,
        .rtl-page .form-control,
        .rtl-page .form-label,
        .rtl-page .alert,
        .rtl-page .btn,
        .rtl-page .dropdown-menu {
            direction: rtl;
        }

        .rtl-page h1,
        .rtl-page h2,
        .rtl-page h3,
        .rtl-page h4,
        .rtl-page h5,
        .rtl-page h6,
        .rtl-page p,
        .rtl-page li,
        .rtl-page .lead,
        .rtl-page .text-muted,
        .rtl-page .form-label,
        .rtl-page .card-body,
        .rtl-page .modal-body,
        .rtl-page .modal-header,
        .rtl-page .modal-footer,
        .rtl-page .offcanvas-body,
        .rtl-page .offcanvas-header,
        .rtl-page .offcanvas-footer {
            text-align: right;
        }

        .rtl-page .form-control,
        .rtl-page textarea,
        .rtl-page input {
            text-align: right;
        }

        .rtl-page .list-inline {
            display: flex;
            flex-wrap: wrap;
            gap: .75rem;
            justify-content: flex-end;
            padding-right: 0;
            margin-bottom: .5rem;
        }

        .rtl-page .list-inline-item {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .rtl-page ul.list-unstyled {
            padding-right: 0;
            margin-bottom: 0;
        }

        .rtl-page .hero-text {
            text-align: right !important;
        }

        .rtl-page .hero-buttons-wrap {
            justify-content: flex-end !important;
        }

        .rtl-page .hero-payment-icons {
            text-align: right !important;
        }

        .rtl-page .d-flex.align-items-center.flex-row-adapt,
        .rtl-page .info-row {
            flex-direction: row-reverse;
        }

        .rtl-page .me-1,
        .rtl-page .me-2,
        .rtl-page .me-3,
        .rtl-page .me-4,
        .rtl-page .me-5 {
            margin-right: 0 !important;
        }

        .rtl-page .ms-1,
        .rtl-page .ms-2,
        .rtl-page .ms-3,
        .rtl-page .ms-4,
        .rtl-page .ms-5 {
            margin-left: 0 !important;
        }

        .rtl-page .me-1 { margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-left: .5rem !important; }
        .rtl-page .me-3 { margin-left: 1rem !important; }
        .rtl-page .me-4 { margin-left: 1.5rem !important; }
        .rtl-page .me-5 { margin-left: 3rem !important; }

        .rtl-page .ms-1 { margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-right: .5rem !important; }
        .rtl-page .ms-3 { margin-right: 1rem !important; }
        .rtl-page .ms-4 { margin-right: 1.5rem !important; }
        .rtl-page .ms-5 { margin-right: 3rem !important; }

        .rtl-page .offcanvas-start {
            left: auto !important;
            right: 0 !important;
            transform: translateX(100%);
        }

        .rtl-page .offcanvas.show:not(.hiding),
        .rtl-page .offcanvas.showing {
            transform: none;
        }

        .rtl-page .contact-buttons,
        .rtl-page .auto-reg-actions,
        .rtl-page .modal-footer-flex {
            flex-direction: row-reverse;
        }

        .rtl-page .social-link-badge {
            justify-content: flex-end;
        }

        /* =========================
           CONTAINER FIXES (Boxed Layout)
        ========================== */
        /* Laisse Bootstrap gérer les conteneurs avec des max-width appropriés */
        .page-wrapper-guest .container,
        .page-wrapper-guest .container-sm,
        .page-wrapper-guest .container-md,
        .page-wrapper-guest .container-lg,
        .page-wrapper-guest .container-xl,
        .page-wrapper-guest .container-xxl {
            margin-left: auto;
            margin-right: auto;
        }

        /* =========================
           MOBILE FIXES
        ========================== */
        @media (max-width: 991.98px) {
            .page-wrapper-guest .container,
            .page-wrapper-guest .container-sm,
            .page-wrapper-guest .container-md,
            .page-wrapper-guest .container-lg,
            .page-wrapper-guest .container-xl,
            .page-wrapper-guest .container-xxl {
                padding-left: 1rem !important;
                padding-right: 1rem !important;
            }

            .hero-title {
                font-size: 1.9rem;
                line-height: 1.45;
            }

            .hero-text {
                font-size: 1rem !important;
                line-height: 1.8;
                text-align: start !important;
            }

            .rtl-page .hero-text {
                text-align: right !important;
            }

            .hero-buttons-wrap {
                display: block !important;
                width: 100%;
            }

            .hero-buttons-group {
                display: flex !important;
                flex-direction: column !important;
                width: 100%;
                gap: .75rem !important;
            }

            .hero-buttons-group .btn {
                width: 100%;
            }

            .stats-row .d-flex {
                align-items: flex-start !important;
            }

            .pricing-switch .nav {
                flex-wrap: wrap;
                justify-content: center;
            }

            .contact-buttons,
            .auto-reg-actions,
            .modal-footer-flex {
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .contact-buttons .btn,
            .auto-reg-actions .btn,
            .modal-footer-flex .btn {
                width: 100%;
            }

            .form-actions-stack {
                display: flex !important;
                flex-direction: column !important;
                gap: .75rem !important;
            }

            .form-actions-stack > * {
                width: 100%;
            }

            .hero-payment-icons {
                text-align: center !important;
            }

            .rtl-page .hero-payment-icons {
                text-align: right !important;
            }

            .gallery-card .card-body {
                padding: 1rem;
            }

            .badge.rounded-pill {
                white-space: normal;
                line-height: 1.5;
            }

            .info-links-wrap {
                flex-direction: column;
                align-items: stretch !important;
            }

            .info-links-wrap a {
                width: 100%;
                justify-content: center;
            }

            .rtl-page .info-links-wrap a {
                justify-content: center;
            }
        }

        @media (max-width: 575.98px) {
            .hero-title {
                font-size: 1.7rem;
            }

            .lead,
            p,
            li,
            .form-label,
            .form-text {
                font-size: .95rem;
                line-height: 1.8;
            }

            .display-6 {
                font-size: 1.7rem;
            }
        }

        /* =========================
   HOME ANNOUNCEMENT POPUP
========================== */
        .announcement-popup-modal .modal-content {
            border: 1px solid rgba(255,255,255,.08);
            background: linear-gradient(180deg, #1c1d22 0%, #141519 100%);
            color: #fff;
            border-radius: 3px;
            overflow: hidden;
            box-shadow: 0 20px 60px rgba(0,0,0,.45);
        }

        .announcement-popup-modal .modal-header,
        .announcement-popup-modal .modal-footer {
            border-color: rgba(255,255,255,.08);
        }

        .announcement-popup-modal .btn-close {
            filter: invert(1) grayscale(100%);
        }

        .announcement-popup-cover {
            width: 100%;
            height: auto;
            object-fit: contain; /* important */
            border-radius: 2px;
        }

        .announcement-popup-type {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            font-size: .82rem;
            font-weight: 700;
            letter-spacing: .2px;
            border: 1px solid rgba(255,255,255,.08);
        }

        .announcement-popup-type.type-info      { background: rgba(13,110,253,.16); color: #8ec5ff; }
        .announcement-popup-type.type-reunion   { background: rgba(111,66,193,.18); color: #c7a6ff; }
        .announcement-popup-type.type-vacances  { background: rgba(25,135,84,.18); color: #7ee2a8; }
        .announcement-popup-type.type-absence   { background: rgba(255,193,7,.18); color: #ffd86b; }
        .announcement-popup-type.type-travaux   { background: rgba(253,126,20,.18); color: #ffb16b; }
        .announcement-popup-type.type-programme { background: rgba(32,201,151,.18); color: #88f0d0; }
        .announcement-popup-type.type-livres    { background: rgba(13,202,240,.18); color: #86eaff; }
        .announcement-popup-type.type-urgence   { background: rgba(220,53,69,.18); color: #ff98a3; }

        .announcement-popup-excerpt {
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.06);
            border-radius: 12px;
            padding: 1rem;
            color: rgba(255,255,255,.92);
        }

        .announcement-popup-body {
            line-height: 1.85;
            color: rgba(255,255,255,.88);
        }

        .announcement-popup-date {
            color: rgba(255,255,255,.60);
            font-size: .92rem;
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #2a3b4e;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

        .btn-registration-cta {
            font-weight: 800;
            padding: 0.75rem 1.4rem;
            box-shadow: 0 0 18px rgba(0, 224, 255, 0.35);
        }

        @media (max-width: 576px) {
            .announcement-popup-modal .modal-dialog {
                margin: 0.5rem;
            }

            .announcement-popup-modal .modal-content {
                border-radius: 18px;
            }

            .announcement-popup-modal .modal-header {
                padding: 1rem;
            }

            .announcement-popup-modal .modal-body {
                padding: 1rem;
            }

            .announcement-popup-excerpt {
                font-size: 1rem !important;
                line-height: 1.35;
            }

            .announcement-popup-body {
                font-size: 0.95rem;
                line-height: 1.5;
            }

            .modal-footer-flex {
                flex-direction: column;
                align-items: stretch;
                gap: 0.75rem;
            }

            .modal-footer-flex .btn {
                width: 100%;
                justify-content: center;
            }

            .btn-registration-cta {
                font-size: 1.05rem;
                padding: 0.85rem 1rem;
            }
        }
        .hero-quran-image {
            max-width: 560px;
            width: 100%;
            height: auto;
            object-fit: contain;
            position: relative;
            z-index: 3;
            opacity: 1 !important;
            visibility: visible !important;
        }

        @media (max-width: 991.98px) {
            .hero-quran-image {
                max-width: 360px;
                margin-top: 1.5rem;
            }
        }

        @media (max-width: 991.98px) {
            .hero-image-desktop {
                display: none !important;
            }
        }

        @media (min-width: 992px) {
            .hero-image-desktop {
                display: flex !important;
            }
        }

/* ===== resources\views\pages\index1.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-bg-2: #0b1324;
            --hud-card: rgba(9, 16, 31, .88);
            --hud-card-strong: rgba(11, 22, 42, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .38);
            --hud-text: #e8f6ff;
            --hud-muted: rgba(232, 246, 255, .68);
            --hud-soft: rgba(232, 246, 255, .48);
            --hud-cyan: #78e8ff;
            --hud-green: #20e070;
            --hud-warning: #ffc857;
            --hud-danger: #ff5d6c;
            --hud-radius: 1.4rem;
            --hud-shadow: 0 22px 60px rgba(0, 0, 0, .38);
        }

        html,
        body {
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        body {
            background: var(--hud-bg);
        }

        .page-wrapper-guest {
            width: 100%;
            min-height: 100vh;
            overflow-x: hidden;
            background:
                radial-gradient(circle at 10% 5%, rgba(120, 232, 255, .10), transparent 32%),
                radial-gradient(circle at 90% 15%, rgba(32, 224, 112, .09), transparent 30%),
                linear-gradient(180deg, #07101c 0%, #0b1324 48%, #07101c 100%);
            color: var(--hud-text);
        }

        @media (min-width: 1660px) {
            .container,
            .container-sm,
            .container-md,
            .container-lg,
            .container-xl,
            .container-xxl {
                max-width: 1320px;
            }
        }

        .section-pad {
            padding: 5rem 0;
        }

        .section-divider {
            border-color: rgba(120, 232, 255, .12);
            opacity: 1;
        }

        .section-kicker {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .55rem 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 999px;
            background: rgba(120, 232, 255, .08);
            color: var(--hud-cyan);
            font-size: .82rem;
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            margin-bottom: 1rem;
        }

        .section-title {
            color: #fff;
            font-weight: 900;
            line-height: 1.15;
            margin-bottom: 1rem;
        }

        .section-title span,
        .text-neon {
            color: var(--hud-cyan) !important;
            text-shadow: 0 0 18px rgba(120, 232, 255, .35);
        }

        .section-subtitle {
            color: var(--hud-muted);
            line-height: 1.85;
            margin-bottom: 0;
        }

        .glass-card,
        .gallery-card,
        .contact-panel,
        .hud-modal .modal-content {
            position: relative;
            border: 1px solid var(--hud-line) !important;
            border-radius: var(--hud-radius);
            background:
                linear-gradient(145deg, rgba(9, 16, 31, .92), rgba(11, 22, 42, .90));
            color: var(--hud-text);
            box-shadow: var(--hud-shadow);
            backdrop-filter: blur(14px);
            overflow: hidden;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        /* ✅ FIX MODAL NEWSLETTER */
        .newsletter-section,
        .newsletter-section .container,
        .newsletter-section .row,
        .newsletter-section .col-lg-7,
        .newsletter-section .glass-card {
            position: relative;
            overflow: visible !important;
            z-index: auto;
        }

        .newsletter-section .modal,
        .modal.newsletter-modal,
        .modal[id*="newsletter"],
        .modal[id*="Newsletter"] {
            position: fixed !important;
            inset: 0 !important;
            z-index: 20050 !important;
        }

        .newsletter-section .modal-dialog,
        .modal[id*="newsletter"] .modal-dialog,
        .modal[id*="Newsletter"] .modal-dialog {
            z-index: 20060 !important;
        }

        .modal-backdrop {
            z-index: 20040 !important;
        }
        .glass-card:hover,
        .gallery-card:hover,
        .contact-panel:hover {
            transform: translateY(-4px);
            border-color: var(--hud-line-strong) !important;
            box-shadow:
                0 26px 70px rgba(0, 0, 0, .46),
                0 0 32px rgba(120, 232, 255, .10);
        }

        .btn-neon,
        .btn-outline-neon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .35rem;
            border-radius: 999px;
            font-weight: 800;
            transition: .25s ease;
        }

        .btn-neon {
            border-color: transparent;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            box-shadow: 0 0 22px rgba(120, 232, 255, .20);
        }

        .btn-neon:hover,
        .btn-outline-neon:hover {
            transform: translateY(-2px);
            color: #03111f;
            border-color: transparent;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            box-shadow: 0 0 24px rgba(120, 232, 255, .28);
        }

        .btn-outline-neon {
            border-color: rgba(120, 232, 255, .48);
            color: var(--hud-cyan);
            background: rgba(120, 232, 255, .06);
        }

        .btn-outline-light {
            border-radius: 999px;
            font-weight: 700;
        }

        .btn-scroll-top {
            position: fixed;
            right: 1rem;
            bottom: 1rem;
            z-index: 1080;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 46px;
            height: 46px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            text-decoration: none;
            box-shadow: 0 0 22px rgba(120, 232, 255, .22);
            opacity: 0;
            visibility: hidden;
            transition: opacity .2s, visibility .2s, transform .2s;
        }

        .btn-scroll-top.show {
            opacity: 1;
            visibility: visible;
        }

        .btn-scroll-top:hover {
            transform: translateY(-2px);
        }

        .hero-section {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            overflow: hidden;
            isolation: isolate;
            background:
                linear-gradient(90deg, rgba(7, 16, 28, .98), rgba(7, 16, 28, .80)),
                url('/assets/img/landing/cover.jpg') center/cover no-repeat;
        }

        .hero-section::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: -2;
            background: url('/assets/css/images/pattern-dark.png');
            opacity: .22;
        }

        .hero-section::after {
            content: '';
            position: absolute;
            width: 520px;
            height: 520px;
            right: -160px;
            top: 12%;
            z-index: -1;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(120, 232, 255, .20), transparent 65%);
            filter: blur(6px);
        }

        .hero-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .55rem 1rem;
            border-radius: 999px;
            border: 1px solid var(--hud-line);
            background: rgba(120, 232, 255, .08);
            color: var(--hud-cyan);
            font-weight: 800;
            margin-bottom: 1rem;
        }

        .hero-title {
            color: #fff;
            font-weight: 600;
            letter-spacing: 0;
            line-height: 1.12;
            margin-bottom: 1.25rem;
        }

        .hero-text {
            max-width: 680px;
            color: var(--hud-muted) !important;
            font-size: 1.08rem !important;
            line-height: 1.9;
        }

        .hero-payment-icons {
            color: rgba(232, 246, 255, .36);
        }

        .hero-payment-icons i {
            margin: .25rem;
            transition: color .25s ease, transform .25s ease;
        }

        .hero-payment-icons i:hover {
            color: var(--hud-cyan);
            transform: translateY(-2px);
        }

        .hero-quran-image {
            max-width: 560px;
            width: 100%;
            height: auto;
            object-fit: contain;
            position: relative;
            z-index: 3;
            filter: drop-shadow(0 22px 48px rgba(0, 0, 0, .50));
        }

        .hero-image-frame {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2rem;
        }

        .hero-image-frame::before {
            content: '';
            position: absolute;
            inset: 8%;
            border-radius: 50%;
            border: 1px solid rgba(120, 232, 255, .20);
            box-shadow: 0 0 60px rgba(120, 232, 255, .08);
        }

        .stat-card {
            display: flex;
            align-items: center;
            gap: .9rem;
            height: 100%;
            padding: 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 1.1rem;
            background: rgba(255, 255, 255, .035);
        }

        .stat-icon {
            width: 44px;
            height: 44px;
            display: grid;
            place-items: center;
            flex: 0 0 auto;
            border-radius: 14px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.35rem;
        }

        .offcanvas {
            background: var(--hud-bg-2);
            color: var(--hud-text);
        }

        .offcanvas .card {
            background: rgba(255, 255, 255, .04);
            border: 1px solid var(--hud-line) !important;
            color: var(--hud-text);
        }

        .about-section,
        .gallery-section,
        .contact-section,
        .newsletter-section {
            background:
                radial-gradient(circle at top right, rgba(120, 232, 255, .06), transparent 36%),
                rgba(255, 255, 255, .015);
        }

        .about-panel {
            padding: clamp(1.25rem, 3vw, 2.5rem);
        }

        .pricing-section {
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(circle at top left, rgba(120, 232, 255, .12), transparent 35%),
                radial-gradient(circle at bottom right, rgba(32, 224, 112, .12), transparent 40%),
                linear-gradient(135deg, #07101c, #0b1324);
        }

        .pricing-toggle {
            display: flex;
            gap: .5rem;
            padding: .45rem;
            border-radius: 999px;
            background: rgba(255, 255, 255, .06);
            border: 1px solid rgba(255, 255, 255, .12);
        }

        .pricing-toggle-btn {
            border: 0;
            border-radius: 999px;
            padding: .75rem 1.15rem;
            color: var(--hud-text);
            background: transparent;
            font-weight: 800;
            transition: .25s ease;
        }

        .pricing-toggle-btn.active,
        .pricing-toggle-btn:hover {
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
        }

        .pricing-toggle-btn span {
            margin-left: .4rem;
            padding: .15rem .45rem;
            border-radius: 999px;
            background: rgba(255, 255, 255, .22);
            font-size: .72rem;
        }

        .pricing-card {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            min-height: 100%;
            padding: 2rem 1.4rem 1.4rem;
            border-radius: var(--hud-radius);
            border: 1px solid var(--hud-line);
            background: linear-gradient(145deg, rgba(9, 16, 31, .94), rgba(12, 25, 45, .92));
            box-shadow: var(--hud-shadow);
            backdrop-filter: blur(14px);
            transition: .3s ease;
        }

        .pricing-card:hover,
        .pricing-card-popular {
            transform: translateY(-6px);
            border-color: var(--hud-line-strong);
            box-shadow:
                0 26px 70px rgba(0, 0, 0, .46),
                0 0 32px rgba(120, 232, 255, .12);
        }

        .pricing-legend {
            width: auto;
            max-width: calc(100% - 1rem);
            margin: 0 auto 1rem;
            padding: .5rem 1rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .04em;
            color: #fff;
            text-align: center;
        }

        .legend-danger { background: linear-gradient(135deg, #dc3545, #ff7582); }
        .legend-primary { background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green)); color: #03111f; }
        .legend-warning { background: linear-gradient(135deg, #ffc107, #ff8c00); color: #241400; }

        .pricing-icon {
            width: 58px;
            height: 58px;
            display: grid;
            place-items: center;
            border-radius: 18px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.7rem;
            margin-bottom: 1.2rem;
        }

        .pricing-card h5 {
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .pricing-card-subtitle,
        .gallery-meta,
        .contact-muted {
            color: var(--hud-muted);
        }

        .pricing-price {
            margin-top: 1.5rem;
            color: #fff;
        }

        .pricing-price span {
            font-size: 2rem;
            font-weight: 950;
        }

        .pricing-price small {
            color: var(--hud-muted);
            font-weight: 700;
        }

        .pricing-card hr {
            border-color: rgba(255, 255, 255, .12);
            margin: 1.4rem 0;
        }

        .pricing-features {
            list-style: none;
            padding: 0;
            margin: 0 0 1.5rem;
            display: grid;
            gap: .85rem;
            flex-grow: 1;
        }

        .pricing-features li {
            display: flex;
            gap: .7rem;
            color: var(--hud-muted);
            line-height: 1.45;
        }

        .pricing-features li i {
            color: var(--hud-green);
            font-size: 1.08rem;
            margin-top: .15rem;
        }

        .pricing-features li.disabled {
            color: var(--hud-soft);
        }

        .pricing-features li.disabled i {
            color: var(--hud-danger);
        }

        .pricing-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .35rem;
            width: 100%;
            border: 1px solid rgba(120, 232, 255, .45);
            border-radius: 999px;
            padding: .85rem 1.2rem;
            background: rgba(120, 232, 255, .08);
            color: var(--hud-text);
            font-weight: 900;
            text-decoration: none;
            transition: .25s ease;
        }

        .pricing-btn:hover,
        .pricing-btn-primary {
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            border-color: transparent;
            box-shadow: 0 0 20px rgba(120, 232, 255, .25);
        }

        .gallery-card img {
            width: 100%;
            aspect-ratio: 16 / 10;
            object-fit: cover;
            border-radius: 1rem;
        }

        .gallery-card a,
        .contact-panel a {
            color: var(--hud-cyan);
        }

        .gallery-card h5 {
            color: #fff;
            font-weight: 850;
        }

        .contact-panel {
            padding: clamp(1.25rem, 3vw, 2rem);
        }

        .contact-info-item {
            display: flex;
            gap: .9rem;
            padding: 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 1rem;
            background: rgba(255, 255, 255, .035);
            margin-bottom: 1rem;
        }

        .contact-info-item i {
            width: 38px;
            height: 38px;
            display: grid;
            place-items: center;
            flex: 0 0 auto;
            border-radius: 12px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.15rem;
        }

        .form-control,
        textarea {
            min-width: 0;
            border-color: rgba(120, 232, 255, .20);
            background-color: rgba(255, 255, 255, .045);
            color: var(--hud-text);
            border-radius: 1rem;
            padding: .775rem .75rem !important;
        }

        .form-control:focus,
        textarea:focus {
            color: var(--hud-text);
            background-color: rgba(255, 255, 255, .065);
            border-color: rgba(120, 232, 255, .55);
            box-shadow: 0 0 0 .25rem rgba(120, 232, 255, .10);
        }

        .form-control::placeholder,
        textarea::placeholder {
            color: rgba(232, 246, 255, .42);
        }

        .form-label,
        label {
            color: rgba(232, 246, 255, .82);
            font-weight: 700;
        }

        .text-muted,
        .form-text {
            color: var(--hud-muted) !important;
        }

        .text-break-all,
        .text-break-all a,
        .contact-info-block p,
        .contact-info-block a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .announcement-popup-modal .modal-content {
            border: 1px solid var(--hud-line);
            background: linear-gradient(180deg, #111827 0%, #07101c 100%);
            color: #fff;
            border-radius: var(--hud-radius);
            overflow: hidden;
            box-shadow: 0 24px 70px rgba(0,0,0,.55);
        }

        .announcement-popup-modal .modal-header,
        .announcement-popup-modal .modal-footer,
        .hud-modal .modal-header,
        .hud-modal .modal-footer {
            border-color: rgba(120, 232, 255, .14);
        }

        .announcement-popup-modal .btn-close,
        .hud-modal .btn-close {
            filter: invert(1) grayscale(100%);
        }

        .announcement-popup-cover {
            width: 100%;
            height: auto;
            object-fit: contain;
            border-radius: 1rem;
        }

        .announcement-popup-type {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            font-size: .82rem;
            font-weight: 800;
            letter-spacing: .2px;
            border: 1px solid rgba(255,255,255,.08);
        }

        .announcement-popup-type.type-info      { background: rgba(13,110,253,.16); color: #8ec5ff; }
        .announcement-popup-type.type-reunion   { background: rgba(111,66,193,.18); color: #c7a6ff; }
        .announcement-popup-type.type-vacances  { background: rgba(25,135,84,.18); color: #7ee2a8; }
        .announcement-popup-type.type-absence   { background: rgba(255,193,7,.18); color: #ffd86b; }
        .announcement-popup-type.type-travaux   { background: rgba(253,126,20,.18); color: #ffb16b; }
        .announcement-popup-type.type-programme { background: rgba(32,201,151,.18); color: #88f0d0; }
        .announcement-popup-type.type-livres    { background: rgba(13,202,240,.18); color: #86eaff; }
        .announcement-popup-type.type-urgence   { background: rgba(220,53,69,.18); color: #ff98a3; }

        .announcement-popup-excerpt {
            background: rgba(120, 232, 255, .07);
            border: 1px solid rgba(120, 232, 255, .14);
            border-radius: 1rem;
            padding: 1rem;
            color: var(--hud-cyan);
        }

        .announcement-popup-body {
            line-height: 1.85;
            color: rgba(255,255,255,.88);
        }

        .announcement-popup-date {
            color: rgba(255,255,255,.60);
            font-size: .92rem;
        }

        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page,
        .rtl-page .offcanvas,
        .rtl-page .modal-content,
        .rtl-page .card,
        .rtl-page .form-control,
        .rtl-page .form-label,
        .rtl-page .alert,
        .rtl-page .btn,
        .rtl-page .dropdown-menu {
            direction: rtl;
        }

        .rtl-page h1,
        .rtl-page h2,
        .rtl-page h3,
        .rtl-page h4,
        .rtl-page h5,
        .rtl-page h6,
        .rtl-page p,
        .rtl-page li,
        .rtl-page .lead,
        .rtl-page .text-muted,
        .rtl-page .form-label,
        .rtl-page .card-body,
        .rtl-page .modal-body,
        .rtl-page .modal-header,
        .rtl-page .modal-footer,
        .rtl-page .offcanvas-body,
        .rtl-page .offcanvas-header,
        .rtl-page .offcanvas-footer {
            text-align: right;
        }

        .rtl-page .form-control,
        .rtl-page textarea,
        .rtl-page input {
            text-align: right;
        }

        .rtl-page .list-inline {
            display: flex;
            flex-wrap: wrap;
            gap: .75rem;
            justify-content: flex-end;
            padding-right: 0;
            margin-bottom: .5rem;
        }

        .rtl-page .list-inline-item {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .rtl-page ul.list-unstyled {
            padding-right: 0;
            margin-bottom: 0;
        }

        .rtl-page .hero-text {
            text-align: right !important;
        }

        .rtl-page .hero-buttons-wrap {
            justify-content: flex-end !important;
        }

        .rtl-page .hero-payment-icons {
            text-align: right !important;
        }

        .rtl-page .d-flex.align-items-center.flex-row-adapt,
        .rtl-page .info-row,
        .rtl-page .stat-card,
        .rtl-page .contact-info-item {
            flex-direction: row-reverse;
        }

        .rtl-page .me-1,.rtl-page .me-2,.rtl-page .me-3,.rtl-page .me-4,.rtl-page .me-5 { margin-right: 0 !important; }
        .rtl-page .ms-1,.rtl-page .ms-2,.rtl-page .ms-3,.rtl-page .ms-4,.rtl-page .ms-5 { margin-left: 0 !important; }
        .rtl-page .me-1 { margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-left: .5rem !important; }
        .rtl-page .me-3 { margin-left: 1rem !important; }
        .rtl-page .me-4 { margin-left: 1.5rem !important; }
        .rtl-page .me-5 { margin-left: 3rem !important; }
        .rtl-page .ms-1 { margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-right: .5rem !important; }
        .rtl-page .ms-3 { margin-right: 1rem !important; }
        .rtl-page .ms-4 { margin-right: 1.5rem !important; }
        .rtl-page .ms-5 { margin-right: 3rem !important; }

        .rtl-page .offcanvas-start {
            left: auto !important;
            right: 0 !important;
            transform: translateX(100%);
        }

        .rtl-page .offcanvas.show:not(.hiding),
        .rtl-page .offcanvas.showing {
            transform: none;
        }

        .rtl-page .contact-buttons,
        .rtl-page .auto-reg-actions,
        .rtl-page .modal-footer-flex {
            flex-direction: row-reverse;
        }

        .rtl-page .social-link-badge {
            justify-content: flex-end;
        }

        @media (max-width: 991.98px) {
            .page-wrapper-guest .container,
            .page-wrapper-guest .container-sm,
            .page-wrapper-guest .container-md,
            .page-wrapper-guest .container-lg,
            .page-wrapper-guest .container-xl,
            .page-wrapper-guest .container-xxl {
                padding-left: 1rem !important;
                padding-right: 1rem !important;
            }

            .section-pad {
                padding: 3.5rem 0;
            }

            .hero-section {
                min-height: auto;
                padding-top: 5rem;
                padding-bottom: 3rem;
            }

            .hero-title {
                font-size: 2rem;
                line-height: 1.25;
            }

            .hero-text {
                font-size: 1rem !important;
                line-height: 1.8;
                text-align: start !important;
            }

            .rtl-page .hero-text {
                text-align: right !important;
            }

            .hero-buttons-wrap,
            .hero-buttons-group {
                display: flex !important;
                flex-direction: column !important;
                width: 100%;
                gap: .75rem !important;
            }

            .hero-buttons-group .btn {
                width: 100%;
            }

            .hero-image-desktop {
                display: none !important;
            }

            .pricing-toggle {
                flex-direction: column;
                border-radius: 1.2rem;
                width: 100%;
            }

            .pricing-toggle-btn {
                width: 100%;
            }

            .contact-buttons,
            .auto-reg-actions,
            .modal-footer-flex,
            .form-actions-stack {
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .contact-buttons .btn,
            .auto-reg-actions .btn,
            .modal-footer-flex .btn,
            .form-actions-stack > * {
                width: 100%;
            }

            .hero-payment-icons {
                text-align: center !important;
            }

            .rtl-page .hero-payment-icons {
                text-align: right !important;
            }

            .badge.rounded-pill {
                white-space: normal;
                line-height: 1.5;
            }

            .info-links-wrap {
                flex-direction: column;
                align-items: stretch !important;
            }

            .info-links-wrap a {
                width: 100%;
                justify-content: center;
            }
        }

        @media (min-width: 992px) {
            .hero-image-desktop {
                display: flex !important;
            }
        }

        @media (max-width: 575.98px) {
            .hero-title,
            .section-title,
            .display-6 {
                font-size: 1.75rem;
            }

            .lead,
            p,
            li,
            .form-label,
            .form-text {
                font-size: .95rem;
                line-height: 1.8;
            }

            .pricing-card {
                padding: 1.75rem 1.15rem 1.15rem;
            }

            .pricing-price span {
                font-size: 1.7rem;
            }

            .announcement-popup-modal .modal-dialog {
                margin: .5rem;
            }

            .announcement-popup-modal .modal-content {
                border-radius: 18px;
            }
        }
        .pricing-price {
            margin: 0 !important;
            white-space: nowrap;
            color: #fff;
            font-weight: 900;
        }

        .pricing-price .monthly-price {
            font-size: 2rem;
            font-weight: 950;
            line-height: 1;
        }

        .pricing-price .price-period {
            color: var(--hud-muted);
            font-weight: 700;
            margin-left: .25rem;
        }

        .pricing-icon.mb-0 {
            margin-bottom: 0 !important;
            flex-shrink: 0;
        }

/* ===== resources\views\pages\index1.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-bg-2: #0b1324;
            --hud-card: rgba(9, 16, 31, .88);
            --hud-card-strong: rgba(11, 22, 42, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .38);
            --hud-text: #e8f6ff;
            --hud-muted: rgba(232, 246, 255, .68);
            --hud-soft: rgba(232, 246, 255, .48);
            --hud-cyan: #78e8ff;
            --hud-green: #20e070;
            --hud-warning: #ffc857;
            --hud-danger: #ff5d6c;
            --hud-radius: 1.4rem;
            --hud-shadow: 0 22px 60px rgba(0, 0, 0, .38);
        }

        html,
        body {
            overflow-x: hidden;
            scroll-behavior: smooth;
        }

        body {
            background: var(--hud-bg);
        }

        .page-wrapper-guest {
            width: 100%;
            min-height: 100vh;
            overflow-x: hidden;
            background:
                radial-gradient(circle at 10% 5%, rgba(120, 232, 255, .10), transparent 32%),
                radial-gradient(circle at 90% 15%, rgba(32, 224, 112, .09), transparent 30%),
                linear-gradient(180deg, #07101c 0%, #0b1324 48%, #07101c 100%);
            color: var(--hud-text);
        }

        @media (min-width: 1660px) {
            .container,
            .container-sm,
            .container-md,
            .container-lg,
            .container-xl,
            .container-xxl {
                max-width: 1320px;
            }
        }

        .section-pad {
            padding: 5rem 0;
        }

        .section-divider {
            border-color: rgba(120, 232, 255, .12);
            opacity: 1;
        }

        .section-kicker {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .55rem 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 999px;
            background: rgba(120, 232, 255, .08);
            color: var(--hud-cyan);
            font-size: .82rem;
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            margin-bottom: 1rem;
        }

        .section-title {
            color: #fff;
            font-weight: 900;
            line-height: 1.15;
            margin-bottom: 1rem;
        }

        .section-title span,
        .text-neon {
            color: var(--hud-cyan) !important;
            text-shadow: 0 0 18px rgba(120, 232, 255, .35);
        }

        .section-subtitle {
            color: var(--hud-muted);
            line-height: 1.85;
            margin-bottom: 0;
        }

        .glass-card,
        .gallery-card,
        .contact-panel,
        .hud-modal .modal-content {
            position: relative;
            border: 1px solid var(--hud-line) !important;
            border-radius: var(--hud-radius);
            background:
                linear-gradient(145deg, rgba(9, 16, 31, .92), rgba(11, 22, 42, .90));
            color: var(--hud-text);
            box-shadow: var(--hud-shadow);
            backdrop-filter: blur(14px);
            overflow: hidden;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        /* ✅ FIX MODAL NEWSLETTER */
        .newsletter-section,
        .newsletter-section .container,
        .newsletter-section .row,
        .newsletter-section .col-lg-7,
        .newsletter-section .glass-card {
            position: relative;
            overflow: visible !important;
            z-index: auto;
        }

        .newsletter-section .modal,
        .modal.newsletter-modal,
        .modal[id*="newsletter"],
        .modal[id*="Newsletter"] {
            position: fixed !important;
            inset: 0 !important;
            z-index: 20050 !important;
        }

        .newsletter-section .modal-dialog,
        .modal[id*="newsletter"] .modal-dialog,
        .modal[id*="Newsletter"] .modal-dialog {
            z-index: 20060 !important;
        }

        .modal-backdrop {
            z-index: 20040 !important;
        }
        .glass-card:hover,
        .gallery-card:hover,
        .contact-panel:hover {
            transform: translateY(-4px);
            border-color: var(--hud-line-strong) !important;
            box-shadow:
                0 26px 70px rgba(0, 0, 0, .46),
                0 0 32px rgba(120, 232, 255, .10);
        }

        .btn-neon,
        .btn-outline-neon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .35rem;
            border-radius: 999px;
            font-weight: 800;
            transition: .25s ease;
        }

        .btn-neon {
            border-color: transparent;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            box-shadow: 0 0 22px rgba(120, 232, 255, .20);
        }

        .btn-neon:hover,
        .btn-outline-neon:hover {
            transform: translateY(-2px);
            color: #03111f;
            border-color: transparent;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            box-shadow: 0 0 24px rgba(120, 232, 255, .28);
        }

        .btn-outline-neon {
            border-color: rgba(120, 232, 255, .48);
            color: var(--hud-cyan);
            background: rgba(120, 232, 255, .06);
        }

        .btn-outline-light {
            border-radius: 999px;
            font-weight: 700;
        }

        .btn-scroll-top {
            position: fixed;
            right: 1rem;
            bottom: 1rem;
            z-index: 1080;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 46px;
            height: 46px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            text-decoration: none;
            box-shadow: 0 0 22px rgba(120, 232, 255, .22);
            opacity: 0;
            visibility: hidden;
            transition: opacity .2s, visibility .2s, transform .2s;
        }

        .btn-scroll-top.show {
            opacity: 1;
            visibility: visible;
        }

        .btn-scroll-top:hover {
            transform: translateY(-2px);
        }

        .hero-section {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            overflow: hidden;
            isolation: isolate;
            background:
                linear-gradient(90deg, rgba(7, 16, 28, .98), rgba(7, 16, 28, .80)),
                url('/assets/img/landing/cover.jpg') center/cover no-repeat;
        }

        .hero-section::before {
            content: '';
            position: absolute;
            inset: 0;
            z-index: -2;
            background: url('/assets/css/images/pattern-dark.png');
            opacity: .22;
        }

        .hero-section::after {
            content: '';
            position: absolute;
            width: 520px;
            height: 520px;
            right: -160px;
            top: 12%;
            z-index: -1;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(120, 232, 255, .20), transparent 65%);
            filter: blur(6px);
        }

        .hero-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .55rem 1rem;
            border-radius: 999px;
            border: 1px solid var(--hud-line);
            background: rgba(120, 232, 255, .08);
            color: var(--hud-cyan);
            font-weight: 800;
            margin-bottom: 1rem;
        }

        .hero-title {
            color: #fff;
            font-weight: 600;
            letter-spacing: 0;
            line-height: 1.12;
            margin-bottom: 1.25rem;
        }

        .hero-text {
            max-width: 680px;
            color: var(--hud-muted) !important;
            font-size: 1.08rem !important;
            line-height: 1.9;
        }

        .hero-payment-icons {
            color: rgba(232, 246, 255, .36);
        }

        .hero-payment-icons i {
            margin: .25rem;
            transition: color .25s ease, transform .25s ease;
        }

        .hero-payment-icons i:hover {
            color: var(--hud-cyan);
            transform: translateY(-2px);
        }

        .hero-quran-image {
            max-width: 560px;
            width: 100%;
            height: auto;
            object-fit: contain;
            position: relative;
            z-index: 3;
            filter: drop-shadow(0 22px 48px rgba(0, 0, 0, .50));
        }

        .hero-image-frame {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 2rem;
        }

        .hero-image-frame::before {
            content: '';
            position: absolute;
            inset: 8%;
            border-radius: 50%;
            border: 1px solid rgba(120, 232, 255, .20);
            box-shadow: 0 0 60px rgba(120, 232, 255, .08);
        }

        .stat-card {
            display: flex;
            align-items: center;
            gap: .9rem;
            height: 100%;
            padding: 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 1.1rem;
            background: rgba(255, 255, 255, .035);
        }

        .stat-icon {
            width: 44px;
            height: 44px;
            display: grid;
            place-items: center;
            flex: 0 0 auto;
            border-radius: 14px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.35rem;
        }

        .offcanvas {
            background: var(--hud-bg-2);
            color: var(--hud-text);
        }

        .offcanvas .card {
            background: rgba(255, 255, 255, .04);
            border: 1px solid var(--hud-line) !important;
            color: var(--hud-text);
        }

        .about-section,
        .gallery-section,
        .contact-section,
        .newsletter-section {
            background:
                radial-gradient(circle at top right, rgba(120, 232, 255, .06), transparent 36%),
                rgba(255, 255, 255, .015);
        }

        .about-panel {
            padding: clamp(1.25rem, 3vw, 2.5rem);
        }

        .pricing-section {
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(circle at top left, rgba(120, 232, 255, .12), transparent 35%),
                radial-gradient(circle at bottom right, rgba(32, 224, 112, .12), transparent 40%),
                linear-gradient(135deg, #07101c, #0b1324);
        }

        .pricing-toggle {
            display: flex;
            gap: .5rem;
            padding: .45rem;
            border-radius: 999px;
            background: rgba(255, 255, 255, .06);
            border: 1px solid rgba(255, 255, 255, .12);
        }

        .pricing-toggle-btn {
            border: 0;
            border-radius: 999px;
            padding: .75rem 1.15rem;
            color: var(--hud-text);
            background: transparent;
            font-weight: 800;
            transition: .25s ease;
        }

        .pricing-toggle-btn.active,
        .pricing-toggle-btn:hover {
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
        }

        .pricing-toggle-btn span {
            margin-left: .4rem;
            padding: .15rem .45rem;
            border-radius: 999px;
            background: rgba(255, 255, 255, .22);
            font-size: .72rem;
        }

        .pricing-card {
            position: relative;
            display: flex;
            flex-direction: column;
            width: 100%;
            min-height: 100%;
            padding: 2rem 1.4rem 1.4rem;
            border-radius: var(--hud-radius);
            border: 1px solid var(--hud-line);
            background: linear-gradient(145deg, rgba(9, 16, 31, .94), rgba(12, 25, 45, .92));
            box-shadow: var(--hud-shadow);
            backdrop-filter: blur(14px);
            transition: .3s ease;
        }

        .pricing-card:hover,
        .pricing-card-popular {
            transform: translateY(-6px);
            border-color: var(--hud-line-strong);
            box-shadow:
                0 26px 70px rgba(0, 0, 0, .46),
                0 0 32px rgba(120, 232, 255, .12);
        }

        .pricing-legend {
            width: auto;
            max-width: calc(100% - 1rem);
            margin: 0 auto 1rem;
            padding: .5rem 1rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .04em;
            color: #fff;
            text-align: center;
        }

        .legend-danger { background: linear-gradient(135deg, #dc3545, #ff7582); }
        .legend-primary { background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green)); color: #03111f; }
        .legend-warning { background: linear-gradient(135deg, #ffc107, #ff8c00); color: #241400; }

        .pricing-icon {
            width: 58px;
            height: 58px;
            display: grid;
            place-items: center;
            border-radius: 18px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.7rem;
            margin-bottom: 1.2rem;
        }

        .pricing-card h5 {
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .pricing-card-subtitle,
        .gallery-meta,
        .contact-muted {
            color: var(--hud-muted);
        }

        .pricing-price {
            margin-top: 1.5rem;
            color: #fff;
        }

        .pricing-price span {
            font-size: 2rem;
            font-weight: 950;
        }

        .pricing-price small {
            color: var(--hud-muted);
            font-weight: 700;
        }

        .pricing-card hr {
            border-color: rgba(255, 255, 255, .12);
            margin: 1.4rem 0;
        }

        .pricing-features {
            list-style: none;
            padding: 0;
            margin: 0 0 1.5rem;
            display: grid;
            gap: .85rem;
            flex-grow: 1;
        }

        .pricing-features li {
            display: flex;
            gap: .7rem;
            color: var(--hud-muted);
            line-height: 1.45;
        }

        .pricing-features li i {
            color: var(--hud-green);
            font-size: 1.08rem;
            margin-top: .15rem;
        }

        .pricing-features li.disabled {
            color: var(--hud-soft);
        }

        .pricing-features li.disabled i {
            color: var(--hud-danger);
        }

        .pricing-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .35rem;
            width: 100%;
            border: 1px solid rgba(120, 232, 255, .45);
            border-radius: 999px;
            padding: .85rem 1.2rem;
            background: rgba(120, 232, 255, .08);
            color: var(--hud-text);
            font-weight: 900;
            text-decoration: none;
            transition: .25s ease;
        }

        .pricing-btn:hover,
        .pricing-btn-primary {
            background: linear-gradient(135deg, var(--hud-cyan), var(--hud-green));
            color: #03111f;
            border-color: transparent;
            box-shadow: 0 0 20px rgba(120, 232, 255, .25);
        }

        .gallery-card img {
            width: 100%;
            aspect-ratio: 16 / 10;
            object-fit: cover;
            border-radius: 1rem;
        }

        .gallery-card a,
        .contact-panel a {
            color: var(--hud-cyan);
        }

        .gallery-card h5 {
            color: #fff;
            font-weight: 850;
        }

        .contact-panel {
            padding: clamp(1.25rem, 3vw, 2rem);
        }

        .contact-info-item {
            display: flex;
            gap: .9rem;
            padding: 1rem;
            border: 1px solid var(--hud-line);
            border-radius: 1rem;
            background: rgba(255, 255, 255, .035);
            margin-bottom: 1rem;
        }

        .contact-info-item i {
            width: 38px;
            height: 38px;
            display: grid;
            place-items: center;
            flex: 0 0 auto;
            border-radius: 12px;
            background: rgba(120, 232, 255, .10);
            color: var(--hud-cyan);
            font-size: 1.15rem;
        }

        .form-control,
        textarea {
            min-width: 0;
            border-color: rgba(120, 232, 255, .20);
            background-color: rgba(255, 255, 255, .045);
            color: var(--hud-text);
            border-radius: 1rem;
            padding: .775rem .75rem !important;
        }

        .form-control:focus,
        textarea:focus {
            color: var(--hud-text);
            background-color: rgba(255, 255, 255, .065);
            border-color: rgba(120, 232, 255, .55);
            box-shadow: 0 0 0 .25rem rgba(120, 232, 255, .10);
        }

        .form-control::placeholder,
        textarea::placeholder {
            color: rgba(232, 246, 255, .42);
        }

        .form-label,
        label {
            color: rgba(232, 246, 255, .82);
            font-weight: 700;
        }

        .text-muted,
        .form-text {
            color: var(--hud-muted) !important;
        }

        .text-break-all,
        .text-break-all a,
        .contact-info-block p,
        .contact-info-block a {
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .announcement-popup-modal .modal-content {
            border: 1px solid var(--hud-line);
            background: linear-gradient(180deg, #111827 0%, #07101c 100%);
            color: #fff;
            border-radius: var(--hud-radius);
            overflow: hidden;
            box-shadow: 0 24px 70px rgba(0,0,0,.55);
        }

        .announcement-popup-modal .modal-header,
        .announcement-popup-modal .modal-footer,
        .hud-modal .modal-header,
        .hud-modal .modal-footer {
            border-color: rgba(120, 232, 255, .14);
        }

        .announcement-popup-modal .btn-close,
        .hud-modal .btn-close {
            filter: invert(1) grayscale(100%);
        }

        .announcement-popup-cover {
            width: 100%;
            height: auto;
            object-fit: contain;
            border-radius: 1rem;
        }

        .announcement-popup-type {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            font-size: .82rem;
            font-weight: 800;
            letter-spacing: .2px;
            border: 1px solid rgba(255,255,255,.08);
        }

        .announcement-popup-type.type-info      { background: rgba(13,110,253,.16); color: #8ec5ff; }
        .announcement-popup-type.type-reunion   { background: rgba(111,66,193,.18); color: #c7a6ff; }
        .announcement-popup-type.type-vacances  { background: rgba(25,135,84,.18); color: #7ee2a8; }
        .announcement-popup-type.type-absence   { background: rgba(255,193,7,.18); color: #ffd86b; }
        .announcement-popup-type.type-travaux   { background: rgba(253,126,20,.18); color: #ffb16b; }
        .announcement-popup-type.type-programme { background: rgba(32,201,151,.18); color: #88f0d0; }
        .announcement-popup-type.type-livres    { background: rgba(13,202,240,.18); color: #86eaff; }
        .announcement-popup-type.type-urgence   { background: rgba(220,53,69,.18); color: #ff98a3; }

        .announcement-popup-excerpt {
            background: rgba(120, 232, 255, .07);
            border: 1px solid rgba(120, 232, 255, .14);
            border-radius: 1rem;
            padding: 1rem;
            color: var(--hud-cyan);
        }

        .announcement-popup-body {
            line-height: 1.85;
            color: rgba(255,255,255,.88);
        }

        .announcement-popup-date {
            color: rgba(255,255,255,.60);
            font-size: .92rem;
        }

        .rtl-page {
            direction: rtl;
            text-align: right;
        }

        .rtl-page,
        .rtl-page .offcanvas,
        .rtl-page .modal-content,
        .rtl-page .card,
        .rtl-page .form-control,
        .rtl-page .form-label,
        .rtl-page .alert,
        .rtl-page .btn,
        .rtl-page .dropdown-menu {
            direction: rtl;
        }

        .rtl-page h1,
        .rtl-page h2,
        .rtl-page h3,
        .rtl-page h4,
        .rtl-page h5,
        .rtl-page h6,
        .rtl-page p,
        .rtl-page li,
        .rtl-page .lead,
        .rtl-page .text-muted,
        .rtl-page .form-label,
        .rtl-page .card-body,
        .rtl-page .modal-body,
        .rtl-page .modal-header,
        .rtl-page .modal-footer,
        .rtl-page .offcanvas-body,
        .rtl-page .offcanvas-header,
        .rtl-page .offcanvas-footer {
            text-align: right;
        }

        .rtl-page .form-control,
        .rtl-page textarea,
        .rtl-page input {
            text-align: right;
        }

        .rtl-page .list-inline {
            display: flex;
            flex-wrap: wrap;
            gap: .75rem;
            justify-content: flex-end;
            padding-right: 0;
            margin-bottom: .5rem;
        }

        .rtl-page .list-inline-item {
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .rtl-page ul.list-unstyled {
            padding-right: 0;
            margin-bottom: 0;
        }

        .rtl-page .hero-text {
            text-align: right !important;
        }

        .rtl-page .hero-buttons-wrap {
            justify-content: flex-end !important;
        }

        .rtl-page .hero-payment-icons {
            text-align: right !important;
        }

        .rtl-page .d-flex.align-items-center.flex-row-adapt,
        .rtl-page .info-row,
        .rtl-page .stat-card,
        .rtl-page .contact-info-item {
            flex-direction: row-reverse;
        }

        .rtl-page .me-1,.rtl-page .me-2,.rtl-page .me-3,.rtl-page .me-4,.rtl-page .me-5 { margin-right: 0 !important; }
        .rtl-page .ms-1,.rtl-page .ms-2,.rtl-page .ms-3,.rtl-page .ms-4,.rtl-page .ms-5 { margin-left: 0 !important; }
        .rtl-page .me-1 { margin-left: .25rem !important; }
        .rtl-page .me-2 { margin-left: .5rem !important; }
        .rtl-page .me-3 { margin-left: 1rem !important; }
        .rtl-page .me-4 { margin-left: 1.5rem !important; }
        .rtl-page .me-5 { margin-left: 3rem !important; }
        .rtl-page .ms-1 { margin-right: .25rem !important; }
        .rtl-page .ms-2 { margin-right: .5rem !important; }
        .rtl-page .ms-3 { margin-right: 1rem !important; }
        .rtl-page .ms-4 { margin-right: 1.5rem !important; }
        .rtl-page .ms-5 { margin-right: 3rem !important; }

        .rtl-page .offcanvas-start {
            left: auto !important;
            right: 0 !important;
            transform: translateX(100%);
        }

        .rtl-page .offcanvas.show:not(.hiding),
        .rtl-page .offcanvas.showing {
            transform: none;
        }

        .rtl-page .contact-buttons,
        .rtl-page .auto-reg-actions,
        .rtl-page .modal-footer-flex {
            flex-direction: row-reverse;
        }

        .rtl-page .social-link-badge {
            justify-content: flex-end;
        }

        @media (max-width: 991.98px) {
            .page-wrapper-guest .container,
            .page-wrapper-guest .container-sm,
            .page-wrapper-guest .container-md,
            .page-wrapper-guest .container-lg,
            .page-wrapper-guest .container-xl,
            .page-wrapper-guest .container-xxl {
                padding-left: 1rem !important;
                padding-right: 1rem !important;
            }

            .section-pad {
                padding: 3.5rem 0;
            }

            .hero-section {
                min-height: auto;
                padding-top: 5rem;
                padding-bottom: 3rem;
            }

            .hero-title {
                font-size: 2rem;
                line-height: 1.25;
            }

            .hero-text {
                font-size: 1rem !important;
                line-height: 1.8;
                text-align: start !important;
            }

            .rtl-page .hero-text {
                text-align: right !important;
            }

            .hero-buttons-wrap,
            .hero-buttons-group {
                display: flex !important;
                flex-direction: column !important;
                width: 100%;
                gap: .75rem !important;
            }

            .hero-buttons-group .btn {
                width: 100%;
            }

            .hero-image-desktop {
                display: none !important;
            }

            .pricing-toggle {
                flex-direction: column;
                border-radius: 1.2rem;
                width: 100%;
            }

            .pricing-toggle-btn {
                width: 100%;
            }

            .contact-buttons,
            .auto-reg-actions,
            .modal-footer-flex,
            .form-actions-stack {
                flex-direction: column !important;
                align-items: stretch !important;
                gap: .75rem !important;
            }

            .contact-buttons .btn,
            .auto-reg-actions .btn,
            .modal-footer-flex .btn,
            .form-actions-stack > * {
                width: 100%;
            }

            .hero-payment-icons {
                text-align: center !important;
            }

            .rtl-page .hero-payment-icons {
                text-align: right !important;
            }

            .badge.rounded-pill {
                white-space: normal;
                line-height: 1.5;
            }

            .info-links-wrap {
                flex-direction: column;
                align-items: stretch !important;
            }

            .info-links-wrap a {
                width: 100%;
                justify-content: center;
            }
        }

        @media (min-width: 992px) {
            .hero-image-desktop {
                display: flex !important;
            }
        }

        @media (max-width: 575.98px) {
            .hero-title,
            .section-title,
            .display-6 {
                font-size: 1.75rem;
            }

            .lead,
            p,
            li,
            .form-label,
            .form-text {
                font-size: .95rem;
                line-height: 1.8;
            }

            .pricing-card {
                padding: 1.75rem 1.15rem 1.15rem;
            }

            .pricing-price span {
                font-size: 1.7rem;
            }

            .announcement-popup-modal .modal-dialog {
                margin: .5rem;
            }

            .announcement-popup-modal .modal-content {
                border-radius: 18px;
            }
        }
        .pricing-price {
            margin: 0 !important;
            white-space: nowrap;
            color: #fff;
            font-weight: 900;
        }

        .pricing-price .monthly-price {
            font-size: 2rem;
            font-weight: 950;
            line-height: 1;
        }

        .pricing-price .price-period {
            color: var(--hud-muted);
            font-weight: 700;
            margin-left: .25rem;
        }

        .pricing-icon.mb-0 {
            margin-bottom: 0 !important;
            flex-shrink: 0;
        }

/* ===== resources\views\pages\mentions.blade.php :: <style> ===== */
:root {
            --bg-main: #0f0f10;
            --bg-card: #1b1c20;
            --text-main: #f1f1f1;
            --text-dim: #d5d6d7;
            --accent: #00d084;
            --border-col: rgba(255,255,255,0.08);
            --radius-lg: 16px;
            --radius-md: 10px;
        }
        *{box-sizing:border-box}
        a,a:visited,a:hover,a:focus,a:active{text-decoration:none;color:inherit}
        .wrapper{width:100%;max-width:900px;background-color:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-col);box-shadow:0 30px 80px rgba(188,188,188,.8),0 2px 4px rgba(191,191,191,.6);padding:2rem clamp(1rem,2vw,2rem) 3rem;position:relative}
        header.page-head{margin-bottom:2rem;position:relative}
        .badge-domain{display:inline-block;font-size:.7rem;font-weight:600;line-height:1;padding:.5rem .6rem;margin-right:.5rem;background-color:rgba(0,208,132,.12);border:1px solid rgba(0,208,132,.4);color:var(--accent);border-radius:999px;text-transform:uppercase;letter-spacing:.05em}
        h1{margin:.75rem 0 0 0;font-size:1.3rem;font-weight:600;color:#fff;line-height:1.25}
        .intro{margin-top:.5rem;font-size:.9rem;color:var(--text-dim)}
        section.block{background-color:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:var(--radius-md);box-shadow:0 1px 2px rgba(188,188,188,.8),0 1px 2px rgba(191,191,191,.6);padding:1rem 1rem .5rem;margin-bottom:1rem}
        section.block h2{margin-top:0;margin-bottom:.5rem;font-size:.95rem;line-height:1.3;font-weight:600;color:#fff}
        section.block p,section.block ul,section.block li{font-size:.9rem;color:var(--text-dim);margin-top:0}
        section.block ul{padding-left:1.2rem;margin-bottom:.75rem}
        section.block li{margin-bottom:.4rem}
        .legal-footer{margin-top:2rem;font-size:.75rem;color:var(--text-dim);text-align:center;line-height:1.4;opacity:.8}
        strong{color:#fff;font-weight:600}
        .accent{color:var(--accent);font-weight:600}
        @media (max-width:520px){
            body{padding:1rem}
            .wrapper{padding:1.25rem 1rem 2rem;border-radius:12px}
            h1{font-size:1.15rem}
        }

/* ===== resources\views\pages\mentions.blade.php :: @push(css) ===== */

        :root {
            --bg-main: #0f0f10;
            --bg-card: #1b1c20;
            --text-main: #f1f1f1;
            --text-dim: #d5d6d7;
            --accent: #00d084;
            --border-col: rgba(255,255,255,0.08);
            --radius-lg: 16px;
            --radius-md: 10px;
        }
        *{box-sizing:border-box}
        a,a:visited,a:hover,a:focus,a:active{text-decoration:none;color:inherit}
        .wrapper{width:100%;max-width:900px;background-color:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-col);box-shadow:0 30px 80px rgba(188,188,188,.8),0 2px 4px rgba(191,191,191,.6);padding:2rem clamp(1rem,2vw,2rem) 3rem;position:relative}
        header.page-head{margin-bottom:2rem;position:relative}
        .badge-domain{display:inline-block;font-size:.7rem;font-weight:600;line-height:1;padding:.5rem .6rem;margin-right:.5rem;background-color:rgba(0,208,132,.12);border:1px solid rgba(0,208,132,.4);color:var(--accent);border-radius:999px;text-transform:uppercase;letter-spacing:.05em}
        h1{margin:.75rem 0 0 0;font-size:1.3rem;font-weight:600;color:#fff;line-height:1.25}
        .intro{margin-top:.5rem;font-size:.9rem;color:var(--text-dim)}
        section.block{background-color:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:var(--radius-md);box-shadow:0 1px 2px rgba(188,188,188,.8),0 1px 2px rgba(191,191,191,.6);padding:1rem 1rem .5rem;margin-bottom:1rem}
        section.block h2{margin-top:0;margin-bottom:.5rem;font-size:.95rem;line-height:1.3;font-weight:600;color:#fff}
        section.block p,section.block ul,section.block li{font-size:.9rem;color:var(--text-dim);margin-top:0}
        section.block ul{padding-left:1.2rem;margin-bottom:.75rem}
        section.block li{margin-bottom:.4rem}
        .legal-footer{margin-top:2rem;font-size:.75rem;color:var(--text-dim);text-align:center;line-height:1.4;opacity:.8}
        strong{color:#fff;font-weight:600}
        .accent{color:var(--accent);font-weight:600}
        @media (max-width:520px){
            body{padding:1rem}
            .wrapper{padding:1.25rem 1rem 2rem;border-radius:12px}
            h1{font-size:1.15rem}
        }

/* ===== resources\views\pages\nouraniya.blade.php :: <style> ===== */
.nouraniya-page {
            --np-radius: 2px;
            --np-radius-sm: 1px;
            --np-border: rgba(255,255,255,.08);
            --np-soft: rgba(255,255,255,.05);
            --np-shadow: 0 10px 30px rgba(0,0,0,.16);
            --np-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .nouraniya-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--np-soft);
            box-shadow: var(--np-shadow);
        }

        .nouraniya-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .nouraniya-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .nouraniya-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .nouraniya-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--np-radius);
            border: 1px solid var(--np-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .nouraniya-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--np-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .nouraniya-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .nouraniya-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .nouraniya-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .nouraniya-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .nouraniya-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--np-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
            flex-shrink: 0;
        }

        .nouraniya-page .content-image:hover,
        .nouraniya-page .book-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
            filter: brightness(1.02);
        }

        .nouraniya-page .book-image {
            width: 100%;
            border-radius: var(--np-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
        }

        .nouraniya-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 2px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .nouraniya-page .text-justify {
            text-align: justify;
        }

        .nouraniya-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        .nouraniya-page .btn-success {
            box-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 8px 18px rgba(25,135,84,.25);
        }

        .nouraniya-page .btn-success:hover {
            transform: translateY(-1px);
        }

        @media (min-width: 768px) {
            .nouraniya-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .nouraniya-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .nouraniya-page .section-card {
                padding: .9rem;
            }

            .nouraniya-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .nouraniya-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .nouraniya-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .nouraniya-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .nouraniya-page h3 {
                font-size: 1.35rem;
            }

            .nouraniya-page h4 {
                font-size: 1.12rem;
            }

            .nouraniya-page h5 {
                font-size: 1rem;
            }

            .nouraniya-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\pages\nouraniya.blade.php :: @push(css) ===== */

        .nouraniya-page {
            --np-radius: 2px;
            --np-radius-sm: 1px;
            --np-border: rgba(255,255,255,.08);
            --np-soft: rgba(255,255,255,.05);
            --np-shadow: 0 10px 30px rgba(0,0,0,.16);
            --np-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .nouraniya-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--np-soft);
            box-shadow: var(--np-shadow);
        }

        .nouraniya-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .nouraniya-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .nouraniya-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .nouraniya-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--np-radius);
            border: 1px solid var(--np-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .nouraniya-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--np-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .nouraniya-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .nouraniya-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .nouraniya-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .nouraniya-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .nouraniya-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--np-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
            flex-shrink: 0;
        }

        .nouraniya-page .content-image:hover,
        .nouraniya-page .book-image:hover {
            transform: scale(1.015);
            box-shadow: 0 12px 30px rgba(0,0,0,.22);
            filter: brightness(1.02);
        }

        .nouraniya-page .book-image {
            width: 100%;
            border-radius: var(--np-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            transition: transform .3s ease, box-shadow .3s ease, filter .3s ease;
        }

        .nouraniya-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 2px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .nouraniya-page .text-justify {
            text-align: justify;
        }

        .nouraniya-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        .nouraniya-page .btn-success {
            box-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 8px 18px rgba(25,135,84,.25);
        }

        .nouraniya-page .btn-success:hover {
            transform: translateY(-1px);
        }

        @media (min-width: 768px) {
            .nouraniya-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .nouraniya-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .nouraniya-page .section-card {
                padding: .9rem;
            }

            .nouraniya-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .nouraniya-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .nouraniya-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .nouraniya-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .nouraniya-page h3 {
                font-size: 1.35rem;
            }

            .nouraniya-page h4 {
                font-size: 1.12rem;
            }

            .nouraniya-page h5 {
                font-size: 1rem;
            }

            .nouraniya-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\pages\paypal.blade.php :: <style> ===== */
.paypal-button-row.paypal-button-layout-vertical {
            max-width: 400px !important;
        }
        .payment-info p {
            text-align: justify;
        }

/* ===== resources\views\pages\paypal.blade.php :: @push(css) ===== */

        .paypal-button-row.paypal-button-layout-vertical {
            max-width: 400px !important;
        }
        .payment-info p {
            text-align: justify;
        }

/* ===== resources\views\pages\planning.blade.php :: <style> ===== */

/* ===== HUD-like schedule ===== */
        .schedule-wrap { overflow: auto; border-radius: 14px; }
        .schedule-grid { min-width: 980px; border-collapse: separate; border-spacing: 0; }
        .schedule-grid th, .schedule-grid td { vertical-align: top; }
        .schedule-grid thead th {
            position: sticky; top: 0; z-index: 5;
            background: rgba(255,255,255,.96);
            backdrop-filter: blur(6px);
            border-bottom: 1px solid rgba(0,0,0,.06);
        }
        .schedule-grid .time-col {
            position: sticky; left: 0; z-index: 6;
            background: rgba(255,255,255,.96);
            backdrop-filter: blur(6px);
            border-right: 1px solid rgba(0,0,0,.06);
            width: 150px;
        }
        .schedule-grid .day-col { min-width: 190px; }
        .schedule-grid td {
            height: 120px;
            border-bottom: 1px solid rgba(0,0,0,.06);
            border-right: 1px solid rgba(0,0,0,.06);
            background: #fff;
            padding: .6rem .6rem .7rem;
        }
        .schedule-grid tr td:first-child { border-left: 1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th { border-right: 1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th:first-child { border-left: 1px solid rgba(0,0,0,.06); }

        .slot-label {
            font-size: .85rem;
            line-height: 1.1;
            font-weight: 700;
        }
        .slot-sub {
            font-size: .75rem;
            opacity: .65;
        }

        .ev-card {
            border-radius: 14px;
            border: 1px solid rgba(0,0,0,.06);
            box-shadow: 0 8px 22px rgba(0,0,0,.06);
            padding: .55rem .65rem;
            margin-bottom: .5rem;
            cursor: pointer;
            transition: transform .12s ease, box-shadow .12s ease;
            position: relative;
            overflow: hidden;
        }
        .ev-card:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(0,0,0,.10); }

        .ev-bar {
            position: absolute; left: 0; top: 0; bottom: 0;
            width: 6px; border-radius: 14px 0 0 14px;
            background: var(--evColor, #0d6efd);
        }

        .ev-title { font-weight: 800; font-size: .9rem; margin-bottom: .15rem; }
        .ev-meta { font-size: .78rem; opacity: .78; }
        .ev-badges .badge { font-weight: 700; }

        .avatar-xxs {
            width: 22px; height: 22px; border-radius: 999px; object-fit: cover;
            border: 1px solid rgba(0,0,0,.08);
        }

        .today-pill {
            display: inline-flex; align-items: center; gap: .35rem;
            padding: .15rem .5rem;
            border-radius: 999px;
            background: rgba(13,110,253,.10);
            color: #0d6efd;
            font-size: .75rem;
            font-weight: 800;
            border: 1px solid rgba(13,110,253,.18);
        }

        .filters .form-select, .filters .form-control { min-width: 180px; }
        @media (max-width: 576px){
            .filters .form-select, .filters .form-control { min-width: 100%; }
        }

        /* ✅ FIX THEME HUD (dark/light) : évite blanc sur blanc */
        .schedule-grid,
        .schedule-grid th,
        .schedule-grid td {
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }

        .schedule-wrap {
            background: var(--bs-body-bg) !important;
        }

        /* Fond des cellules */
        .schedule-grid td {
            background: var(--bs-body-bg) !important;
        }

        /* Entête (jours) + colonne horaire sticky */
        .schedule-grid thead th,
        .schedule-grid .time-col {
            background: var(--bs-tertiary-bg) !important;
        }

        /* Carte évènement */
        .ev-card {
            background: var(--bs-body-bg) !important;
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }

        /* Texte secondaire */
        .ev-meta,
        .slot-sub {
            color: rgba(var(--bs-body-color-rgb), .75) !important;
            opacity: 1 !important;
        }

/* ===== resources\views\pages\planning.blade.php :: @push(css) ===== */

/* ===== resources\views\pages\planning_public.blade.php :: <style> ===== */
.schedule-wrap { overflow:auto; border-radius:3px; }
        .schedule-grid { min-width: 980px; border-collapse: separate; border-spacing:0; }
        .schedule-grid th, .schedule-grid td { vertical-align: top; }
        .schedule-grid thead th { position: sticky; top:0; z-index:5; backdrop-filter: blur(6px); border-bottom:1px solid rgba(0,0,0,.06); }
        .schedule-grid .time-col { position: sticky; left:0; z-index:6; width:170px; border-right:1px solid rgba(0,0,0,.06); backdrop-filter: blur(6px); }
        .schedule-grid .day-col { min-width: 150px; }
        .schedule-grid td { height: 110px; border-bottom:1px solid rgba(0,0,0,.06); border-right:1px solid rgba(0,0,0,.06); padding:.75rem; }
        .schedule-grid tr td:first-child { border-left:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th { border-right:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th:first-child { border-left:1px solid rgba(0,0,0,.06); }

        .slot-label { font-size:.9rem; font-weight:800; line-height:1.1; }
        .slot-sub { font-size:.75rem; opacity:.75; }

        .time-pill {
            display:inline-flex; align-items:center; gap:.4rem;
            padding:.35rem .6rem; border-radius:999px;
            border:1px solid var(--bs-border-color);
            background: rgba(var(--bs-body-color-rgb, 33,37,41), .06);
            font-weight:800; font-size:.85rem;
            white-space:nowrap;
        }

        /* Dark/light compatible */
        .schedule-grid, .schedule-grid th, .schedule-grid td {
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }
        .schedule-wrap { background: var(--bs-body-bg) !important; }
        .schedule-grid td { background: var(--bs-body-bg) !important; }
        .schedule-grid thead th, .schedule-grid .time-col { background: var(--bs-tertiary-bg) !important; }

        .today-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .5rem; border-radius:999px;
            background: rgba(13,110,253,.10); color:#0d6efd;
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(13,110,253,.18);
        }

        /* Ramadan badge color (subtle) */
        .ramadan-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .55rem; border-radius:999px;
            background: rgba(255,193,7,.12);
            color: var(--bs-warning-text-emphasis, #b38600);
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(255,193,7,.25);
            white-space:nowrap;
        }

/* ===== resources\views\pages\planning_public.blade.php :: @push(css) ===== */

        .schedule-wrap { overflow:auto; border-radius:3px; }
        .schedule-grid { min-width: 980px; border-collapse: separate; border-spacing:0; }
        .schedule-grid th, .schedule-grid td { vertical-align: top; }
        .schedule-grid thead th { position: sticky; top:0; z-index:5; backdrop-filter: blur(6px); border-bottom:1px solid rgba(0,0,0,.06); }
        .schedule-grid .time-col { position: sticky; left:0; z-index:6; width:170px; border-right:1px solid rgba(0,0,0,.06); backdrop-filter: blur(6px); }
        .schedule-grid .day-col { min-width: 150px; }
        .schedule-grid td { height: 110px; border-bottom:1px solid rgba(0,0,0,.06); border-right:1px solid rgba(0,0,0,.06); padding:.75rem; }
        .schedule-grid tr td:first-child { border-left:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th { border-right:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th:first-child { border-left:1px solid rgba(0,0,0,.06); }

        .slot-label { font-size:.9rem; font-weight:800; line-height:1.1; }
        .slot-sub { font-size:.75rem; opacity:.75; }

        .time-pill {
            display:inline-flex; align-items:center; gap:.4rem;
            padding:.35rem .6rem; border-radius:999px;
            border:1px solid var(--bs-border-color);
            background: rgba(var(--bs-body-color-rgb, 33,37,41), .06);
            font-weight:800; font-size:.85rem;
            white-space:nowrap;
        }

        /* Dark/light compatible */
        .schedule-grid, .schedule-grid th, .schedule-grid td {
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }
        .schedule-wrap { background: var(--bs-body-bg) !important; }
        .schedule-grid td { background: var(--bs-body-bg) !important; }
        .schedule-grid thead th, .schedule-grid .time-col { background: var(--bs-tertiary-bg) !important; }

        .today-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .5rem; border-radius:999px;
            background: rgba(13,110,253,.10); color:#0d6efd;
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(13,110,253,.18);
        }

        /* Ramadan badge color (subtle) */
        .ramadan-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .55rem; border-radius:999px;
            background: rgba(255,193,7,.12);
            color: var(--bs-warning-text-emphasis, #b38600);
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(255,193,7,.25);
            white-space:nowrap;
        }

/* ===== resources\views\pages\planning_public_static.blade.php :: <style> ===== */
.schedule-wrap { overflow:auto; border-radius:3px; }
        .schedule-grid { min-width: 980px; border-collapse: separate; border-spacing:0; }
        .schedule-grid th, .schedule-grid td { vertical-align: top; }
        .schedule-grid thead th { position: sticky; top:0; z-index:5; backdrop-filter: blur(6px); border-bottom:1px solid rgba(0,0,0,.06); }
        .schedule-grid .time-col { position: sticky; left:0; z-index:6; width:170px; border-right:1px solid rgba(0,0,0,.06); backdrop-filter: blur(6px); }
        .schedule-grid .day-col { min-width: 150px; }
        .schedule-grid td { height: 110px; border-bottom:1px solid rgba(0,0,0,.06); border-right:1px solid rgba(0,0,0,.06); padding:.75rem; }
        .schedule-grid tr td:first-child { border-left:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th { border-right:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th:first-child { border-left:1px solid rgba(0,0,0,.06); }

        .slot-label { font-size:.9rem; font-weight:800; line-height:1.1; }
        .slot-sub { font-size:.75rem; opacity:.75; }

        .time-pill {
            display:inline-flex; align-items:center; gap:.4rem;
            padding:.35rem .6rem; border-radius:999px;
            border:1px solid var(--bs-border-color);
            background: rgba(var(--bs-body-color-rgb, 33,37,41), .06);
            font-weight:800; font-size:.85rem;
            white-space:nowrap;
        }

        /* Dark/light compatible */
        .schedule-grid, .schedule-grid th, .schedule-grid td {
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }
        .schedule-wrap { background: var(--bs-body-bg) !important; }
        .schedule-grid td { background: var(--bs-body-bg) !important; }
        .schedule-grid thead th, .schedule-grid .time-col { background: var(--bs-tertiary-bg) !important; }

        .today-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .5rem; border-radius:999px;
            background: rgba(13,110,253,.10); color:#0d6efd;
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(13,110,253,.18);
        }

        /* Ramadan badge color (subtle) */
        .ramadan-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .55rem; border-radius:999px;
            background: rgba(255,193,7,.12);
            color: var(--bs-warning-text-emphasis, #b38600);
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(255,193,7,.25);
            white-space:nowrap;
        }

/* ===== resources\views\pages\planning_public_static.blade.php :: @push(css) ===== */

        .schedule-wrap { overflow:auto; border-radius:3px; }
        .schedule-grid { min-width: 980px; border-collapse: separate; border-spacing:0; }
        .schedule-grid th, .schedule-grid td { vertical-align: top; }
        .schedule-grid thead th { position: sticky; top:0; z-index:5; backdrop-filter: blur(6px); border-bottom:1px solid rgba(0,0,0,.06); }
        .schedule-grid .time-col { position: sticky; left:0; z-index:6; width:170px; border-right:1px solid rgba(0,0,0,.06); backdrop-filter: blur(6px); }
        .schedule-grid .day-col { min-width: 150px; }
        .schedule-grid td { height: 110px; border-bottom:1px solid rgba(0,0,0,.06); border-right:1px solid rgba(0,0,0,.06); padding:.75rem; }
        .schedule-grid tr td:first-child { border-left:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th { border-right:1px solid rgba(0,0,0,.06); }
        .schedule-grid thead th:first-child { border-left:1px solid rgba(0,0,0,.06); }

        .slot-label { font-size:.9rem; font-weight:800; line-height:1.1; }
        .slot-sub { font-size:.75rem; opacity:.75; }

        .time-pill {
            display:inline-flex; align-items:center; gap:.4rem;
            padding:.35rem .6rem; border-radius:999px;
            border:1px solid var(--bs-border-color);
            background: rgba(var(--bs-body-color-rgb, 33,37,41), .06);
            font-weight:800; font-size:.85rem;
            white-space:nowrap;
        }

        /* Dark/light compatible */
        .schedule-grid, .schedule-grid th, .schedule-grid td {
            color: var(--bs-body-color) !important;
            border-color: var(--bs-border-color) !important;
        }
        .schedule-wrap { background: var(--bs-body-bg) !important; }
        .schedule-grid td { background: var(--bs-body-bg) !important; }
        .schedule-grid thead th, .schedule-grid .time-col { background: var(--bs-tertiary-bg) !important; }

        .today-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .5rem; border-radius:999px;
            background: rgba(13,110,253,.10); color:#0d6efd;
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(13,110,253,.18);
        }

        /* Ramadan badge color (subtle) */
        .ramadan-pill {
            display:inline-flex; align-items:center; gap:.35rem;
            padding:.15rem .55rem; border-radius:999px;
            background: rgba(255,193,7,.12);
            color: var(--bs-warning-text-emphasis, #b38600);
            font-size:.75rem; font-weight:800;
            border:1px solid rgba(255,193,7,.25);
            white-space:nowrap;
        }

/* ===== resources\views\pages\policy.blade.php :: <style> ===== */
.btn-scroll-top{
            position: fixed; right: 1rem; bottom: 1rem; z-index: 1080;
            display: inline-flex; align-items: center; justify-content: center;
            width: 44px; height: 44px; border-radius: 50%;
            background: #0d6efd; color: #fff; text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, transform .2s;
        }
        .btn-scroll-top.show{ opacity: 1; visibility: visible; }
        .btn-scroll-top:hover{ transform: translateY(-2px); }
        .btn-scroll-top i{ font-size: 18px; line-height: 1; }

/* ===== resources\views\pages\policy.blade.php :: @push(css) ===== */

        .btn-scroll-top{
            position: fixed; right: 1rem; bottom: 1rem; z-index: 1080;
            display: inline-flex; align-items: center; justify-content: center;
            width: 44px; height: 44px; border-radius: 50%;
            background: #0d6efd; color: #fff; text-decoration: none;
            box-shadow: 0 4px 12px rgba(0,0,0,.15);
            opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, transform .2s;
        }
        .btn-scroll-top.show{ opacity: 1; visibility: visible; }
        .btn-scroll-top:hover{ transform: translateY(-2px); }
        .btn-scroll-top i{ font-size: 18px; line-height: 1; }

/* ===== resources\views\pages\preinscription_payment.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .16), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 35%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .deposit-payment-page {
            min-height: calc(100vh - 80px);
            display: flex;
            align-items: center;
            padding: 3rem 1rem;
        }

        .deposit-card {
            position: relative;
            overflow: hidden;
            width: 100%;
            border-radius: 28px;
            color: #f8fafc;
            background: rgba(7, 16, 28, .92);
            border: 1px solid rgba(45, 212, 191, .22);
            box-shadow:
                0 25px 70px rgba(0, 0, 0, .45),
                0 0 40px rgba(45, 212, 191, .08);
            backdrop-filter: blur(16px);
        }

        .deposit-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .14), transparent 35%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
            z-index: 0;
        }

        .deposit-content {
            position: relative;
            z-index: 2;
            padding: clamp(1.4rem, 4vw, 2.5rem);
            text-align: center;
        }

        .deposit-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .deposit-icon {
            width: 100%;
            height: 64px;
            margin: 1.5rem auto 1rem;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 28px;
            color: #04111f;
            background: linear-gradient(135deg, #77c6cf, #67e8f9);
            font-size: 2.45rem;
            box-shadow: 0 18px 40px rgba(45, 212, 191, .28);
        }

        .deposit-title {
            color: #f8fafc;
            font-size: 1.55rem;
            font-weight: 900;
            margin-bottom: .8rem;
        }

        .deposit-subtitle {
            color: rgba(226, 232, 240, .72);
            max-width: 620px;
            margin: 0 auto 1.5rem;
            line-height: 1.7;
        }

        .deposit-info {
            text-align: left;
            padding: 1.15rem;
            border-radius: 22px;
            background: rgba(15, 23, 42, .70);
            border: 1px solid rgba(148, 163, 184, .16);
            margin-bottom: 1.5rem;
        }

        .deposit-info-row {
            display: flex;
            justify-content: space-between;
            gap: 1rem;
            padding: .75rem 0;
            border-bottom: 1px solid rgba(148, 163, 184, .12);
        }

        .deposit-info-row:last-child {
            border-bottom: 0;
        }

        .deposit-info-label {
            color: rgba(226, 232, 240, .62);
            font-weight: 800;
        }

        .deposit-info-value {
            color: #f8fafc;
            font-weight: 800;
            text-align: right;
            overflow-wrap: anywhere;
        }

        .deposit-amount {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-weight: 900;
        }

        .btn-sumup {
            min-height: 52px;
            border: 0;
            border-radius: 999px;
            padding: .85rem 1.5rem;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 14px 32px rgba(45, 212, 191, .26);
        }

        .btn-sumup:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 42px rgba(45, 212, 191, .34);
        }

        .deposit-secure-note {
            margin-top: 1rem;
            color: rgba(226, 232, 240, .60);
            font-size: .9rem;
            line-height: 1.6;
        }

        .deposit-secure-note i {
            color: #9ffaf0;
        }

        @media (max-width: 575.98px) {
            .deposit-payment-page {
                align-items: flex-start;
                padding: 1rem .6rem 2rem;
            }

            .deposit-card {
                border-radius: 22px;
            }

            .deposit-info-row {
                flex-direction: column;
                gap: .25rem;
            }

            .deposit-info-value {
                text-align: left;
            }

            .btn-sumup {
                width: 100%;
            }
        }

/* ===== resources\views\pages\preinscription_payment.blade.php :: @push(css) ===== */

        .app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .16), transparent 35%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 35%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .deposit-payment-page {
            min-height: calc(100vh - 80px);
            display: flex;
            align-items: center;
            padding: 3rem 1rem;
        }

        .deposit-card {
            position: relative;
            overflow: hidden;
            width: 100%;
            border-radius: 28px;
            color: #f8fafc;
            background: rgba(7, 16, 28, .92);
            border: 1px solid rgba(45, 212, 191, .22);
            box-shadow:
                0 25px 70px rgba(0, 0, 0, .45),
                0 0 40px rgba(45, 212, 191, .08);
            backdrop-filter: blur(16px);
        }

        .deposit-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .14), transparent 35%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
            z-index: 0;
        }

        .deposit-content {
            position: relative;
            z-index: 2;
            padding: clamp(1.4rem, 4vw, 2.5rem);
            text-align: center;
        }

        .deposit-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .deposit-icon {
            width: 100%;
            height: 64px;
            margin: 1.5rem auto 1rem;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 28px;
            color: #04111f;
            background: linear-gradient(135deg, #77c6cf, #67e8f9);
            font-size: 2.45rem;
            box-shadow: 0 18px 40px rgba(45, 212, 191, .28);
        }

        .deposit-title {
            color: #f8fafc;
            font-size: 1.55rem;
            font-weight: 900;
            margin-bottom: .8rem;
        }

        .deposit-subtitle {
            color: rgba(226, 232, 240, .72);
            max-width: 620px;
            margin: 0 auto 1.5rem;
            line-height: 1.7;
        }

        .deposit-info {
            text-align: left;
            padding: 1.15rem;
            border-radius: 22px;
            background: rgba(15, 23, 42, .70);
            border: 1px solid rgba(148, 163, 184, .16);
            margin-bottom: 1.5rem;
        }

        .deposit-info-row {
            display: flex;
            justify-content: space-between;
            gap: 1rem;
            padding: .75rem 0;
            border-bottom: 1px solid rgba(148, 163, 184, .12);
        }

        .deposit-info-row:last-child {
            border-bottom: 0;
        }

        .deposit-info-label {
            color: rgba(226, 232, 240, .62);
            font-weight: 800;
        }

        .deposit-info-value {
            color: #f8fafc;
            font-weight: 800;
            text-align: right;
            overflow-wrap: anywhere;
        }

        .deposit-amount {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-weight: 900;
        }

        .btn-sumup {
            min-height: 52px;
            border: 0;
            border-radius: 999px;
            padding: .85rem 1.5rem;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 14px 32px rgba(45, 212, 191, .26);
        }

        .btn-sumup:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 42px rgba(45, 212, 191, .34);
        }

        .deposit-secure-note {
            margin-top: 1rem;
            color: rgba(226, 232, 240, .60);
            font-size: .9rem;
            line-height: 1.6;
        }

        .deposit-secure-note i {
            color: #9ffaf0;
        }

        @media (max-width: 575.98px) {
            .deposit-payment-page {
                align-items: flex-start;
                padding: 1rem .6rem 2rem;
            }

            .deposit-card {
                border-radius: 22px;
            }

            .deposit-info-row {
                flex-direction: column;
                gap: .25rem;
            }

            .deposit-info-value {
                text-align: left;
            }

            .btn-sumup {
                width: 100%;
            }
        }

/* ===== resources\views\pages\privacy\cookies.blade.php :: <style> ===== */
.cookies-hero {
            position: relative;
            overflow: hidden;
            border-radius: 10px;
            padding: 28px;
            background:
                radial-gradient(circle at 15% 20%, rgba(45,212,191,.18), transparent 35%),
                linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border: 1px solid rgba(45,212,191,.28);
            box-shadow: 0 18px 55px rgba(0,0,0,.35);
        }

        .cookies-hero::after {
            content: "";
            position: absolute;
            inset: -80%;
            background: linear-gradient(115deg, transparent 42%, rgba(167,238,251,.14) 50%, transparent 58%);
            animation: cookieHudScan 5s ease-in-out infinite;
            pointer-events: none;
        }

        .cookies-hero h1 {
            color: #a7eefb;
            font-weight: 900;
        }

        .table-hud-wrap {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            border: 1px solid rgba(45,212,191,.28);
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            box-shadow: 0 18px 55px rgba(0,0,0,.35);
        }

        .table-hud-wrap::before {
            content: "";
            position: absolute;
            inset: -60%;
            background: linear-gradient(115deg, transparent 44%, rgba(45,212,191,.12) 50%, transparent 56%);
            animation: cookieHudScan 6s ease-in-out infinite;
            pointer-events: none;
            z-index: 1;
        }

        .table-hud {
            position: relative;
            z-index: 2;
            width: 100%;
            margin: 0;
            color: rgba(255,255,255,.86);
            border-collapse: collapse;
        }

        .table-hud thead th {
            background: rgba(45,212,191,.10);
            color: #a7eefb;
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            padding: 15px;
            border-bottom: 1px solid rgba(45,212,191,.28);
            white-space: nowrap;
        }

        .table-hud td {
            padding: 15px;
            border-bottom: 1px solid rgba(255,255,255,.06);
            vertical-align: middle;
        }

        .table-hud tbody tr {
            transition: .2s ease;
        }

        .table-hud tbody tr:hover {
            background: rgba(45,212,191,.08);
        }

        .table-hud code {
            background: rgba(45,212,191,.12);
            color: #2dd4bf;
            border: 1px solid rgba(45,212,191,.25);
            padding: 5px 9px;
            border-radius: 8px;
        }

        .cookie-category {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            padding: 6px 11px;
            border-radius: 4px;
            font-size: .78rem;
            font-weight: 800;
            white-space: nowrap;
        }

        .cat-necessary {
            background: rgba(34,197,94,.15);
            color: #22c55e;
        }

        .cat-preference {
            background: rgba(45,212,191,.15);
            color: #2dd4bf;
        }

        .cat-analytics {
            background: rgba(59,130,246,.16);
            color: #60a5fa;
        }

        .cat-external {
            background: rgba(168,85,247,.16);
            color: #c084fc;
        }

        .cat-marketing {
            background: rgba(244,63,94,.16);
            color: #fb7185;
        }

        .cookie-required {
            display: inline-flex;
            padding: 5px 10px;
            border-radius: 4px;
            font-weight: 800;
            font-size: .75rem;
        }

        .required-yes {
            background: rgba(34,197,94,.16);
            color: #22c55e;
        }

        .required-no {
            background: rgba(239,68,68,.16);
            color: #f87171;
        }

        .dataTables_wrapper {
            position: relative;
            z-index: 3;
            padding: 18px;
        }

        .dataTables_filter input,
        .dataTables_length select {
            background: rgba(15,23,42,.85) !important;
            border: 1px solid rgba(45,212,191,.35) !important;
            color: #fff !important;
            border-radius: 6px !important;
            padding: 8px 12px !important;
            outline: none !important;
        }

        .dataTables_filter label,
        .dataTables_length label,
        .dataTables_info {
            color: rgba(255,255,255,.72) !important;
        }

        .dataTables_paginate .paginate_button {
            border-radius: 4px !important;
            color: #a7eefb !important;
            border: 1px solid rgba(45,212,191,.25) !important;
            background: rgba(15,23,42,.72) !important;
            margin: 0 3px;
        }

        .dataTables_paginate .paginate_button.current,
        .dataTables_paginate .paginate_button:hover {
            color: #0f172a !important;
            background: #2dd4bf !important;
            border-color: #2dd4bf !important;
        }

        @keyframes cookieHudScan {
            0%, 45% { transform: translateX(-45%) rotate(10deg); }
            70%, 100% { transform: translateX(45%) rotate(10deg); }
        }

        @media (max-width: 768px) {
            .table-hud thead {
                display: none;
            }

            .table-hud tbody tr {
                display: block;
                padding: 12px;
                border-bottom: 1px solid rgba(45,212,191,.18);
            }

            .table-hud td {
                display: flex;
                justify-content: space-between;
                gap: 15px;
                border-bottom: none;
                padding: 8px;
            }

            .table-hud td::before {
                content: attr(data-label);
                color: #a7eefb;
                font-weight: 800;
            }
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\pages\privacy\cookies.blade.php :: @push(css) ===== */

        .cookies-hero {
            position: relative;
            overflow: hidden;
            border-radius: 10px;
            padding: 28px;
            background:
                radial-gradient(circle at 15% 20%, rgba(45,212,191,.18), transparent 35%),
                linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border: 1px solid rgba(45,212,191,.28);
            box-shadow: 0 18px 55px rgba(0,0,0,.35);
        }

        .cookies-hero::after {
            content: "";
            position: absolute;
            inset: -80%;
            background: linear-gradient(115deg, transparent 42%, rgba(167,238,251,.14) 50%, transparent 58%);
            animation: cookieHudScan 5s ease-in-out infinite;
            pointer-events: none;
        }

        .cookies-hero h1 {
            color: #a7eefb;
            font-weight: 900;
        }

        .table-hud-wrap {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            border: 1px solid rgba(45,212,191,.28);
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            box-shadow: 0 18px 55px rgba(0,0,0,.35);
        }

        .table-hud-wrap::before {
            content: "";
            position: absolute;
            inset: -60%;
            background: linear-gradient(115deg, transparent 44%, rgba(45,212,191,.12) 50%, transparent 56%);
            animation: cookieHudScan 6s ease-in-out infinite;
            pointer-events: none;
            z-index: 1;
        }

        .table-hud {
            position: relative;
            z-index: 2;
            width: 100%;
            margin: 0;
            color: rgba(255,255,255,.86);
            border-collapse: collapse;
        }

        .table-hud thead th {
            background: rgba(45,212,191,.10);
            color: #a7eefb;
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            padding: 15px;
            border-bottom: 1px solid rgba(45,212,191,.28);
            white-space: nowrap;
        }

        .table-hud td {
            padding: 15px;
            border-bottom: 1px solid rgba(255,255,255,.06);
            vertical-align: middle;
        }

        .table-hud tbody tr {
            transition: .2s ease;
        }

        .table-hud tbody tr:hover {
            background: rgba(45,212,191,.08);
        }

        .table-hud code {
            background: rgba(45,212,191,.12);
            color: #2dd4bf;
            border: 1px solid rgba(45,212,191,.25);
            padding: 5px 9px;
            border-radius: 8px;
        }

        .cookie-category {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            padding: 6px 11px;
            border-radius: 4px;
            font-size: .78rem;
            font-weight: 800;
            white-space: nowrap;
        }

        .cat-necessary {
            background: rgba(34,197,94,.15);
            color: #22c55e;
        }

        .cat-preference {
            background: rgba(45,212,191,.15);
            color: #2dd4bf;
        }

        .cat-analytics {
            background: rgba(59,130,246,.16);
            color: #60a5fa;
        }

        .cat-external {
            background: rgba(168,85,247,.16);
            color: #c084fc;
        }

        .cat-marketing {
            background: rgba(244,63,94,.16);
            color: #fb7185;
        }

        .cookie-required {
            display: inline-flex;
            padding: 5px 10px;
            border-radius: 4px;
            font-weight: 800;
            font-size: .75rem;
        }

        .required-yes {
            background: rgba(34,197,94,.16);
            color: #22c55e;
        }

        .required-no {
            background: rgba(239,68,68,.16);
            color: #f87171;
        }

        .dataTables_wrapper {
            position: relative;
            z-index: 3;
            padding: 18px;
        }

        .dataTables_filter input,
        .dataTables_length select {
            background: rgba(15,23,42,.85) !important;
            border: 1px solid rgba(45,212,191,.35) !important;
            color: #fff !important;
            border-radius: 6px !important;
            padding: 8px 12px !important;
            outline: none !important;
        }

        .dataTables_filter label,
        .dataTables_length label,
        .dataTables_info {
            color: rgba(255,255,255,.72) !important;
        }

        .dataTables_paginate .paginate_button {
            border-radius: 4px !important;
            color: #a7eefb !important;
            border: 1px solid rgba(45,212,191,.25) !important;
            background: rgba(15,23,42,.72) !important;
            margin: 0 3px;
        }

        .dataTables_paginate .paginate_button.current,
        .dataTables_paginate .paginate_button:hover {
            color: #0f172a !important;
            background: #2dd4bf !important;
            border-color: #2dd4bf !important;
        }

        @keyframes cookieHudScan {
            0%, 45% { transform: translateX(-45%) rotate(10deg); }
            70%, 100% { transform: translateX(45%) rotate(10deg); }
        }

        @media (max-width: 768px) {
            .table-hud thead {
                display: none;
            }

            .table-hud tbody tr {
                display: block;
                padding: 12px;
                border-bottom: 1px solid rgba(45,212,191,.18);
            }

            .table-hud td {
                display: flex;
                justify-content: space-between;
                gap: 15px;
                border-bottom: none;
                padding: 8px;
            }

            .table-hud td::before {
                content: attr(data-label);
                color: #a7eefb;
                font-weight: 800;
            }
        }
        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }
        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .bg-neon {
            color: #a7eefb;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\pages\tajweed.blade.php :: <style> ===== */
.edu-page {
            --ep-radius: 2px;
            --ep-radius-sm: 1px;
            --ep-border: rgba(255,255,255,.08);
            --ep-soft: rgba(255,255,255,.05);
            --ep-shadow: 0 10px 30px rgba(0,0,0,.16);
            --ep-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .edu-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--ep-soft);
            box-shadow: var(--ep-shadow);
        }

        .edu-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .edu-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .edu-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .edu-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--ep-radius);
            border: 1px solid var(--ep-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .edu-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--ep-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .edu-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .edu-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .edu-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .edu-page .full-width-image {
            display: block;
            width: 100%;
            height: auto;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            margin-bottom: 1rem;
        }

        .edu-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .edu-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            flex-shrink: 0;
        }

        .edu-page .book-image {
            width: 100%;
            border-radius: var(--ep-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
        }

        .edu-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 2px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .edu-page .text-justify {
            text-align: justify;
        }

        .edu-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        @media (min-width: 768px) {
            .edu-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .edu-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .edu-page .section-card {
                padding: .9rem;
            }

            .edu-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .edu-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .edu-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .edu-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edu-page h3 { font-size: 1.35rem; }
            .edu-page h4 { font-size: 1.12rem; }
            .edu-page h5 { font-size: 1rem; }

            .edu-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\pages\tajweed.blade.php :: @push(css) ===== */

        .edu-page {
            --ep-radius: 2px;
            --ep-radius-sm: 1px;
            --ep-border: rgba(255,255,255,.08);
            --ep-soft: rgba(255,255,255,.05);
            --ep-shadow: 0 10px 30px rgba(0,0,0,.16);
            --ep-shadow-hover: 0 16px 40px rgba(0,0,0,.22);
        }

        .edu-page .main-card {
            overflow: hidden;
            border-radius: 2px;
            border: 1px solid var(--ep-soft);
            box-shadow: var(--ep-shadow);
        }

        .edu-page .hero-top {
            position: relative;
            overflow: hidden;
        }

        .edu-page .hero-top::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background:
                radial-gradient(circle at top center, rgba(153,204,204,.14), transparent 45%),
                linear-gradient(180deg, rgba(255,255,255,.025), transparent 70%);
        }

        .edu-page .shape svg {
            display: block;
            width: 100%;
            height: auto;
        }

        .edu-page .section-card {
            height: 100%;
            padding: 1rem;
            border-radius: var(--ep-radius);
            border: 1px solid var(--ep-soft);
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01));
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
            transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
        }

        .edu-page .section-card:hover {
            transform: translateY(-2px);
            box-shadow: var(--ep-shadow-hover);
            border-color: rgba(153,204,204,.18);
        }

        .edu-page .section-title {
            position: relative;
            display: inline-block;
            margin-bottom: .35rem;
        }

        .edu-page .section-title::after {
            content: "";
            display: block;
            width: 48px;
            height: 2px;
            margin-top: .4rem;
            border-radius: 2px;
            background: linear-gradient(90deg, #99cccc, transparent);
        }

        .edu-page .section-subtitle {
            margin-bottom: 1rem;
        }

        .edu-page .full-width-image {
            display: block;
            width: 100%;
            height: auto;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            margin-bottom: 1rem;
        }

        .edu-page .media-stack {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: flex-start;
        }

        .edu-page .content-image {
            width: 100%;
            max-width: 260px;
            aspect-ratio: 4 / 3;
            object-fit: cover;
            border-radius: var(--ep-radius-sm);
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
            flex-shrink: 0;
        }

        .edu-page .book-image {
            width: 100%;
            border-radius: var(--ep-radius-sm);
            object-fit: cover;
            border: 1px solid rgba(255,255,255,.08);
            box-shadow: 0 8px 24px rgba(0,0,0,.16);
        }

        .edu-page .price-box {
            border: 1px solid rgba(153,204,204,.16);
            border-radius: 2px;
            padding: 1rem;
            background:
                linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
                var(--bs-dark);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
        }

        .edu-page .text-justify {
            text-align: justify;
        }

        .edu-page .content-divider {
            border-color: rgba(255,255,255,.08);
        }

        @media (min-width: 768px) {
            .edu-page .media-stack {
                flex-direction: row;
                align-items: flex-start;
            }
        }

        @media (max-width: 767.98px) {
            .edu-page .card-body.p-3 {
                padding: 1rem !important;
            }

            .edu-page .section-card {
                padding: .9rem;
            }

            .edu-page .content-image {
                max-width: 100%;
                aspect-ratio: 16 / 10;
            }

            .edu-page .text-justify {
                text-align: left;
            }

            [dir="rtl"] .edu-page .text-justify {
                text-align: right;
            }
        }

        @media (max-width: 575.98px) {
            .edu-page .container-fluid {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edu-page h3 { font-size: 1.35rem; }
            .edu-page h4 { font-size: 1.12rem; }
            .edu-page h5 { font-size: 1rem; }

            .edu-page .price-box {
                padding: .9rem;
            }
        }

/* ===== resources\views\parent\children\absences.blade.php :: <style> ===== */
:root {
            --abs-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --abs-border: rgba(45,212,191,.18);
            --abs-cyan: #2dd4bf;
            --abs-cyan-soft: #a7eefb;
            --abs-muted: rgba(255,255,255,.58);
        }

        .abs-page {
            color: #fff;
        }

        .abs-hero,
        .abs-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--abs-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--abs-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .abs-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .abs-hero .card-body,
        .abs-card .card-body {
            position: relative;
            z-index: 2;
        }

        .abs-title {
            font-size: clamp(1.35rem, 2.4vw, 2.15rem);
            font-weight: 850;
            letter-spacing: .2px;
        }

        .abs-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(45,212,191,.10);
            color: var(--abs-cyan-soft);
            line-height: 1.2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--abs-cyan-soft);
            flex-shrink: 0;
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--abs-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--abs-muted) !important;
        }

        .abs-table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45,212,191,.12);
        }

        .abs-table thead th {
            background: rgba(45,212,191,.08);
            color: #f8fafc;
            border-bottom-width: 1px;
            font-size: .8rem;
            text-transform: uppercase;
            letter-spacing: .4px;
        }

        .abs-table tbody td {
            color: rgba(255,255,255,.9);
            border-color: rgba(45,212,191,.08);
        }

        .abs-table tbody tr:hover > * {
            background: rgba(45,212,191,.055) !important;
        }

        .abs-mobile-list {
            display: none;
        }

        .abs-mobile-item {
            padding: 1rem;
            border: 1px solid rgba(45,212,191,.16);
            border-radius: 14px;
            background: rgba(15,23,42,.45);
        }

        .abs-mobile-item + .abs-mobile-item {
            margin-top: .75rem;
        }

        .abs-kv {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: .75rem;
        }

        .abs-k {
            font-size: .75rem;
            color: var(--abs-muted);
        }

        .abs-v {
            font-weight: 800;
            color: rgba(255,255,255,.9);
        }

        .pagination .page-link {
            background: rgba(45,212,191,.08);
            border-color: rgba(45,212,191,.16);
            color: var(--abs-cyan-soft);
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        @media (max-width: 767.98px) {
            .abs-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .abs-hero,
            .abs-card {
                border-radius: 14px !important;
            }

            .abs-actions {
                width: 100%;
                display: grid !important;
                grid-template-columns: 1fr;
            }

            .abs-actions .btn {
                width: 100%;
            }

            .abs-desktop-table {
                display: none !important;
            }

            .abs-mobile-list {
                display: block;
            }

            .abs-chip {
                width: 100%;
            }
        }

/* ===== resources\views\parent\children\absences.blade.php :: @push(css) ===== */

        :root {
            --abs-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --abs-border: rgba(45,212,191,.18);
            --abs-cyan: #2dd4bf;
            --abs-cyan-soft: #a7eefb;
            --abs-muted: rgba(255,255,255,.58);
        }

        .abs-page {
            color: #fff;
        }

        .abs-hero,
        .abs-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--abs-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--abs-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .abs-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .abs-hero .card-body,
        .abs-card .card-body {
            position: relative;
            z-index: 2;
        }

        .abs-title {
            font-size: clamp(1.35rem, 2.4vw, 2.15rem);
            font-weight: 850;
            letter-spacing: .2px;
        }

        .abs-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(45,212,191,.10);
            color: var(--abs-cyan-soft);
            line-height: 1.2;
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--abs-cyan-soft);
            flex-shrink: 0;
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--abs-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--abs-muted) !important;
        }

        .abs-table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45,212,191,.12);
        }

        .abs-table thead th {
            background: rgba(45,212,191,.08);
            color: #f8fafc;
            border-bottom-width: 1px;
            font-size: .8rem;
            text-transform: uppercase;
            letter-spacing: .4px;
        }

        .abs-table tbody td {
            color: rgba(255,255,255,.9);
            border-color: rgba(45,212,191,.08);
        }

        .abs-table tbody tr:hover > * {
            background: rgba(45,212,191,.055) !important;
        }

        .abs-mobile-list {
            display: none;
        }

        .abs-mobile-item {
            padding: 1rem;
            border: 1px solid rgba(45,212,191,.16);
            border-radius: 14px;
            background: rgba(15,23,42,.45);
        }

        .abs-mobile-item + .abs-mobile-item {
            margin-top: .75rem;
        }

        .abs-kv {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: .75rem;
        }

        .abs-k {
            font-size: .75rem;
            color: var(--abs-muted);
        }

        .abs-v {
            font-weight: 800;
            color: rgba(255,255,255,.9);
        }

        .pagination .page-link {
            background: rgba(45,212,191,.08);
            border-color: rgba(45,212,191,.16);
            color: var(--abs-cyan-soft);
        }

        .pagination .page-item.active .page-link {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border-color: #2dd4bf;
            color: #0f172a;
        }

        @media (max-width: 767.98px) {
            .abs-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .abs-hero,
            .abs-card {
                border-radius: 14px !important;
            }

            .abs-actions {
                width: 100%;
                display: grid !important;
                grid-template-columns: 1fr;
            }

            .abs-actions .btn {
                width: 100%;
            }

            .abs-desktop-table {
                display: none !important;
            }

            .abs-mobile-list {
                display: block;
            }

            .abs-chip {
                width: 100%;
            }
        }

/* ===== resources\views\parent\children\edit.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
            color: #fff;
        }

        .card-header h5 {
            color: #fff;
            font-weight: 700;
        }

        .form-label {
            font-size: 0.9rem;
            opacity: .9;
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-info {
            border-color: rgba(59, 130, 246, 0.4);
            color: #60a5fa;
            background: transparent;
        }

        .btn-outline-info:hover {
            background: rgba(59, 130, 246, 0.1);
            border-color: rgba(59, 130, 246, 0.6);
            color: #93c5fd;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-danger {
            border-color: rgba(239, 68, 68, 0.4);
            color: #f87171;
            background: transparent;
        }

        .btn-outline-danger:hover {
            background: rgba(239, 68, 68, 0.1);
            border-color: rgba(239, 68, 68, 0.6);
            color: #fca5a5;
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(250, 204, 21, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .alert {
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
            color: rgba(255,255,255,.85);
            border-radius: 8px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-danger {
            border-color: rgba(239, 68, 68, 0.3);
            background: rgba(239, 68, 68, 0.08);
            color: #fca5a5;
        }

        .alert-info {
            border-color: rgba(59, 130, 246, 0.3);
            background: rgba(59, 130, 246, 0.08);
            color: #93c5fd;
        }

        .rounded-18 {
            border-radius: 12px;
        }

        .edit-child-header {
            display: flex;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
            padding: 1.5rem;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08), rgba(167, 139, 250, 0.08));
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.15);
            animation: slideInDown 0.6s ease-out;
        }

        .avatar-preview {
            width: 96px;
            height: 96px;
            border-radius: 50%;
            object-fit: cover;
            flex-shrink: 0;
            border: 2px solid rgba(45, 212, 191, 0.3);
            background: rgba(15, 23, 42, 0.8);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.2);
        }

        .edit-child-meta {
            min-width: 0;
            flex: 1 1 260px;
        }

        .edit-child-name {
            font-weight: 700;
            line-height: 1.2;
            word-break: break-word;
            color: #fff;
            font-size: 1.25rem;
        }

        .edit-child-subtitle {
            font-size: .9rem;
            color: rgba(255,255,255,.65);
            word-break: break-word;
            margin-top: 0.25rem;
        }

        .family-warning-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            flex-wrap: wrap;
            padding: 1rem;
            background: rgba(250, 204, 21, 0.08);
            border-left: 3px solid rgba(250, 204, 21, 0.4);
            border-radius: 6px;
            color: #fbbf24;
        }

        .family-warning-badge {
            white-space: normal;
            text-align: center;
            line-height: 1.2;
        }

        .form-control,
        .form-select {
            min-width: 0;
        }

        .card-body,
        .edit-child-meta,
        .btn,
        .badge,
        .alert,
        .form-label,
        .form-control,
        .form-select {
            word-wrap: break-word;
            overflow-wrap: anywhere;
        }

        .table-responsive {
            border-radius: 8px;
            overflow: hidden;
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
        }

        hr {
            border-color: rgba(45, 212, 191, 0.15);
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        @media (max-width: 767.98px) {
            .container.py-4 {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edit-child-header {
                flex-direction: column;
                align-items: flex-start;
                padding: 1rem !important;
            }

            .avatar-preview {
                width: 84px;
                height: 84px;
            }

            .top-actions {
                width: 100%;
            }

            .top-actions .btn {
                width: 100%;
            }

            .family-warning-row {
                align-items: flex-start;
                flex-direction: column;
            }

            .family-warning-badge {
                width: 100%;
            }

            .bottom-actions {
                flex-direction: column;
            }

            .bottom-actions .btn {
                width: 100%;
            }

            .card-body {
                padding: 1.25rem !important;
            }
        }

         .docs-mobile-card {
             display: none;
         }

        .doc-file-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 999px;
            background: rgba(45,212,191,.10);
            border: 1px solid rgba(45,212,191,.25);
            color: #a7eefb;
            font-size: .78rem;
            font-weight: 700;
        }

        @media (max-width: 767.98px) {
            .docs-desktop-table {
                display: none !important;
            }

            .docs-mobile-card {
                display: block;
            }

            .doc-mobile-item {
                padding: 1rem;
                border: 1px solid rgba(45,212,191,.16);
                border-radius: 14px;
                background: rgba(15,23,42,.45);
            }

            .doc-mobile-item + .doc-mobile-item {
                margin-top: .75rem;
            }

            .doc-mobile-actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: .5rem;
                margin-top: .75rem;
            }

            .doc-mobile-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\parent\children\edit.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            border: 1px solid rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card .card-body,
        .card .card-header,
        .card .card-footer {
            position: relative;
            z-index: 2;
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
            color: #fff;
        }

        .card-header h5 {
            color: #fff;
            font-weight: 700;
        }

        .form-label {
            font-size: 0.9rem;
            opacity: .9;
            color: rgba(255,255,255,.82);
            font-weight: 600;
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            background: transparent;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-info {
            border-color: rgba(59, 130, 246, 0.4);
            color: #60a5fa;
            background: transparent;
        }

        .btn-outline-info:hover {
            background: rgba(59, 130, 246, 0.1);
            border-color: rgba(59, 130, 246, 0.6);
            color: #93c5fd;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            border: none;
            color: #fff;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-danger {
            border-color: rgba(239, 68, 68, 0.4);
            color: #f87171;
            background: transparent;
        }

        .btn-outline-danger:hover {
            background: rgba(239, 68, 68, 0.1);
            border-color: rgba(239, 68, 68, 0.6);
            color: #fca5a5;
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(250, 204, 21, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .alert {
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
            color: rgba(255,255,255,.85);
            border-radius: 8px;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-danger {
            border-color: rgba(239, 68, 68, 0.3);
            background: rgba(239, 68, 68, 0.08);
            color: #fca5a5;
        }

        .alert-info {
            border-color: rgba(59, 130, 246, 0.3);
            background: rgba(59, 130, 246, 0.08);
            color: #93c5fd;
        }

        .rounded-18 {
            border-radius: 12px;
        }

        .edit-child-header {
            display: flex;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
            padding: 1.5rem;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.08), rgba(167, 139, 250, 0.08));
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.15);
            animation: slideInDown 0.6s ease-out;
        }

        .avatar-preview {
            width: 96px;
            height: 96px;
            border-radius: 50%;
            object-fit: cover;
            flex-shrink: 0;
            border: 2px solid rgba(45, 212, 191, 0.3);
            background: rgba(15, 23, 42, 0.8);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.2);
        }

        .edit-child-meta {
            min-width: 0;
            flex: 1 1 260px;
        }

        .edit-child-name {
            font-weight: 700;
            line-height: 1.2;
            word-break: break-word;
            color: #fff;
            font-size: 1.25rem;
        }

        .edit-child-subtitle {
            font-size: .9rem;
            color: rgba(255,255,255,.65);
            word-break: break-word;
            margin-top: 0.25rem;
        }

        .family-warning-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            flex-wrap: wrap;
            padding: 1rem;
            background: rgba(250, 204, 21, 0.08);
            border-left: 3px solid rgba(250, 204, 21, 0.4);
            border-radius: 6px;
            color: #fbbf24;
        }

        .family-warning-badge {
            white-space: normal;
            text-align: center;
            line-height: 1.2;
        }

        .form-control,
        .form-select {
            min-width: 0;
        }

        .card-body,
        .edit-child-meta,
        .btn,
        .badge,
        .alert,
        .form-label,
        .form-control,
        .form-select {
            word-wrap: break-word;
            overflow-wrap: anywhere;
        }

        .table-responsive {
            border-radius: 8px;
            overflow: hidden;
        }

        .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
        }

        .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
        }

        hr {
            border-color: rgba(45, 212, 191, 0.15);
        }

        .text-muted {
            color: rgba(255,255,255,.58) !important;
        }

        @media (max-width: 767.98px) {
            .container.py-4 {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .edit-child-header {
                flex-direction: column;
                align-items: flex-start;
                padding: 1rem !important;
            }

            .avatar-preview {
                width: 84px;
                height: 84px;
            }

            .top-actions {
                width: 100%;
            }

            .top-actions .btn {
                width: 100%;
            }

            .family-warning-row {
                align-items: flex-start;
                flex-direction: column;
            }

            .family-warning-badge {
                width: 100%;
            }

            .bottom-actions {
                flex-direction: column;
            }

            .bottom-actions .btn {
                width: 100%;
            }

            .card-body {
                padding: 1.25rem !important;
            }
        }

         .docs-mobile-card {
             display: none;
         }

        .doc-file-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .35rem .6rem;
            border-radius: 999px;
            background: rgba(45,212,191,.10);
            border: 1px solid rgba(45,212,191,.25);
            color: #a7eefb;
            font-size: .78rem;
            font-weight: 700;
        }

        @media (max-width: 767.98px) {
            .docs-desktop-table {
                display: none !important;
            }

            .docs-mobile-card {
                display: block;
            }

            .doc-mobile-item {
                padding: 1rem;
                border: 1px solid rgba(45,212,191,.16);
                border-radius: 14px;
                background: rgba(15,23,42,.45);
            }

            .doc-mobile-item + .doc-mobile-item {
                margin-top: .75rem;
            }

            .doc-mobile-actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: .5rem;
                margin-top: .75rem;
            }

            .doc-mobile-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\parent\children\index.blade.php :: <style> ===== */
.child-card{ border-radius: 2px; overflow:hidden; }
        .child-head{ display:flex; align-items:center; gap:14px; }
        .child-avatar{
            width:62px; height:62px; border-radius:50%;
            object-fit:cover; border:2px solid rgba(255,255,255,.15);
            box-shadow:0 0 0 4px rgba(255,255,255,.06);
            background: rgba(255,255,255,.06);
        }
        .chip{
            display:inline-flex; align-items:center; gap:6px;
            padding:.25rem .55rem; border-radius:999px;
            font-size:12px; font-weight:600;
            border:1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            white-space:nowrap;
        }
        .chip.success{ border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.10); }
        .chip.warn{ border-color: rgba(245,158,11,.35); background: rgba(245,158,11,.10); }
        .chip.info{ border-color: rgba(59,130,246,.35); background: rgba(59,130,246,.10); }
        .chip.muted{ opacity:.85; }
        .actions .btn{ border-radius:2px; }
        .table-mini td, .table-mini th{ font-size:12px; white-space:nowrap; vertical-align:middle; }
        .text-ellipsis{ max-width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ===== NEON HOVER SUR LES CARDS ===== */
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }

/* ===== resources\views\parent\children\index.blade.php :: @push(css) ===== */

        .child-card{ border-radius: 2px; overflow:hidden; }
        .child-head{ display:flex; align-items:center; gap:14px; }
        .child-avatar{
            width:62px; height:62px; border-radius:50%;
            object-fit:cover; border:2px solid rgba(255,255,255,.15);
            box-shadow:0 0 0 4px rgba(255,255,255,.06);
            background: rgba(255,255,255,.06);
        }
        .chip{
            display:inline-flex; align-items:center; gap:6px;
            padding:.25rem .55rem; border-radius:999px;
            font-size:12px; font-weight:600;
            border:1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            white-space:nowrap;
        }
        .chip.success{ border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.10); }
        .chip.warn{ border-color: rgba(245,158,11,.35); background: rgba(245,158,11,.10); }
        .chip.info{ border-color: rgba(59,130,246,.35); background: rgba(59,130,246,.10); }
        .chip.muted{ opacity:.85; }
        .actions .btn{ border-radius:2px; }
        .table-mini td, .table-mini th{ font-size:12px; white-space:nowrap; vertical-align:middle; }
        .text-ellipsis{ max-width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ===== resources\views\parent\children\show.blade.php :: <style> ===== */
:root {
            --child-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --child-border: rgba(45,212,191,.18);
            --child-cyan: #2dd4bf;
            --child-cyan-soft: #a7eefb;
            --child-purple: #a78bfa;
            --child-yellow: #fbbf24;
            --child-muted: rgba(255,255,255,.58);
        }

        .child-page {
            color: #fff;
        }

        .child-hero,
        .child-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--child-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--child-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .child-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .child-hero .card-body,
        .child-card .card-body,
        .child-card .card-header {
            position: relative;
            z-index: 2;
        }

        .child-card {
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .child-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.14),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .child-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .child-title {
            font-size: 1.8rem;
            font-weight: 500;
            letter-spacing: .5px;
            margin-bottom: .35rem;
        }

        .child-avatar {
            width: 104px;
            height: 118px;
            border-radius: 18px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.18);
            flex-shrink: 0;
        }

        .chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            color: rgba(255,255,255,.86);
            line-height: 1.2;
            overflow-wrap: anywhere;
            text-align: center;
        }

        .chip.success {
            border-color: rgba(34,197,94,.35);
            background: rgba(34,197,94,.10);
            color: #86efac;
        }

        .chip.warn {
            border-color: rgba(245,158,11,.38);
            background: rgba(245,158,11,.11);
            color: #fcd34d;
        }

        .chip.info {
            border-color: rgba(59,130,246,.35);
            background: rgba(59,130,246,.10);
            color: #93c5fd;
        }

        .chip.neon {
            border-color: rgba(45,212,191,.32);
            background: rgba(45,212,191,.10);
            color: var(--child-cyan-soft);
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--child-cyan-soft);
            flex-shrink: 0;
        }

        .mini-kv .k {
            font-size: .76rem;
            color: var(--child-muted);
            overflow-wrap: anywhere;
        }

        .mini-kv .v {
            font-weight: 800;
            color: rgba(255,255,255,.92);
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .info-box {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.46);
            height: 100%;
        }

        .text-ellipsis {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--child-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a !important;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--child-muted) !important;
        }

        .child-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        @media (max-width: 767.98px) {
            .child-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .child-hero,
            .child-card {
                border-radius: 14px !important;
            }

            .child-avatar {
                width: 82px;
                height: 94px;
                border-radius: 14px;
            }

            .child-actions {
                width: 100%;
                flex-direction: column;
            }

            .child-actions .btn {
                width: 100%;
            }

            .chip {
                width: 100%;
            }

            .text-ellipsis {
                white-space: normal;
                overflow: visible;
                text-overflow: unset;
            }
        }

/* ===== resources\views\parent\children\show.blade.php :: @push(css) ===== */

        :root {
            --child-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --child-border: rgba(45,212,191,.18);
            --child-cyan: #2dd4bf;
            --child-cyan-soft: #a7eefb;
            --child-purple: #a78bfa;
            --child-yellow: #fbbf24;
            --child-muted: rgba(255,255,255,.58);
        }

        .child-page {
            color: #fff;
        }

        .child-hero,
        .child-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--child-border) !important;
            border-radius: 18px !important;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.16), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.13), transparent 34%),
                var(--child-bg) !important;
            box-shadow: 0 18px 52px rgba(0,0,0,.28) !important;
        }

        .child-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .child-hero .card-body,
        .child-card .card-body,
        .child-card .card-header {
            position: relative;
            z-index: 2;
        }

        .child-card {
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .child-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.48) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.14),
                0 0 28px rgba(45,212,191,.14),
                0 22px 54px rgba(0,0,0,.34) !important;
        }

        .child-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
        }

        .child-title {
            font-size: 1.8rem;
            font-weight: 500;
            letter-spacing: .5px;
            margin-bottom: .35rem;
        }

        .child-avatar {
            width: 104px;
            height: 118px;
            border-radius: 18px;
            object-fit: cover;
            border: 1px solid rgba(45,212,191,.28);
            background: rgba(15,23,42,.8);
            box-shadow: 0 0 24px rgba(45,212,191,.18);
            flex-shrink: 0;
        }

        .chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            color: rgba(255,255,255,.86);
            line-height: 1.2;
            overflow-wrap: anywhere;
            text-align: center;
        }

        .chip.success {
            border-color: rgba(34,197,94,.35);
            background: rgba(34,197,94,.10);
            color: #86efac;
        }

        .chip.warn {
            border-color: rgba(245,158,11,.38);
            background: rgba(245,158,11,.11);
            color: #fcd34d;
        }

        .chip.info {
            border-color: rgba(59,130,246,.35);
            background: rgba(59,130,246,.10);
            color: #93c5fd;
        }

        .chip.neon {
            border-color: rgba(45,212,191,.32);
            background: rgba(45,212,191,.10);
            color: var(--child-cyan-soft);
        }

        .section-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--child-cyan-soft);
            flex-shrink: 0;
        }

        .mini-kv .k {
            font-size: .76rem;
            color: var(--child-muted);
            overflow-wrap: anywhere;
        }

        .mini-kv .v {
            font-weight: 800;
            color: rgba(255,255,255,.92);
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .info-box {
            padding: 1rem;
            border-radius: 14px;
            border: 1px solid rgba(45,212,191,.14);
            background: rgba(15,23,42,.46);
            height: 100%;
        }

        .text-ellipsis {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .btn-outline-neon {
            border-color: rgba(45,212,191,.32);
            color: var(--child-cyan-soft);
            background: transparent;
            font-weight: 700;
        }

        .btn-outline-neon:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.62);
            color: #fff;
            transform: translateY(-1px);
        }

        .btn-neon {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            border: none;
            color: #0f172a !important;
            font-weight: 800;
        }

        .btn-neon:hover {
            box-shadow: 0 0 22px rgba(45,212,191,.34);
            transform: translateY(-1px);
        }

        .text-muted {
            color: var(--child-muted) !important;
        }

        .child-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
        }

        .card,
        .card::before,
        .card-arrow {
            z-index: auto;
        }

        @media (max-width: 767.98px) {
            .child-page {
                padding-left: .75rem !important;
                padding-right: .75rem !important;
            }

            .child-hero,
            .child-card {
                border-radius: 14px !important;
            }

            .child-avatar {
                width: 82px;
                height: 94px;
                border-radius: 14px;
            }

            .child-actions {
                width: 100%;
                flex-direction: column;
            }

            .child-actions .btn {
                width: 100%;
            }

            .chip {
                width: 100%;
            }

            .text-ellipsis {
                white-space: normal;
                overflow: visible;
                text-overflow: unset;
            }
        }

/* ===== resources\views\parent\dashboard.blade.php :: <style> ===== */
.dt-buttons{display:none!important;visibility:hidden!important;}
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

/* ===== PARENT DASHBOARD MODERN STYLES ===== */
        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        /* Hero Section */
        .dashboard-hero{
            position:relative;
            overflow:hidden;
            border-radius:12px;
            border:1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
            padding: 2rem !important;
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .dashboard-hero-title{
            color:#fff;
            font-weight:800;
            margin-bottom:.5rem;
            font-size:2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle{
            color:rgba(255,255,255,.75);
            margin-bottom:0;
            font-size:1rem;
        }

        .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.5rem;
            padding:.6rem 1rem;
            border-radius:8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color:#2dd4bf;
            font-size:.85rem;
            font-weight:700;
            letter-spacing:0.5px;
            backdrop-filter: blur(10px);
        }

        /* Kid Item Cards */
        .kid-item{
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1.25rem;
            border:1px solid rgba(45, 212, 191, 0.2);
            border-radius:12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 30px rgba(0,0,0,.16);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position:relative;
            overflow:hidden;
            animation: fadeInUp 0.6s ease-out;
        }

        .kid-item::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(45, 212, 191, 0.08), transparent 32%);
            pointer-events:none;
        }

        .kid-item,
        .kid-item *{
            min-width:0;
        }

        .kid-item:hover{
            transform:translateY(-4px);
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
        }

        .text-neon {
            color: #2dd4bf;
        }

        .kid-avatar-wrap{
            position:relative;
            flex-shrink:0;
        }

        .kid-avatar{
            width:64px;
            height:72px;
            object-fit:cover;
            border-radius:8px;
            border:1px solid rgba(45, 212, 191, 0.3);
            background:rgba(255,255,255,.05);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.1);
        }

        .kid-presence-dot{
            position:absolute;
            right:-2px;
            bottom:-2px;
            width:16px;
            height:16px;
            border-radius:50%;
            border:2px solid #0f172a;
            box-shadow:0 0 0 3px rgba(255,255,255,.04);
        }

        .kid-presence-dot.is-live{
            background:#22c55e;
            animation:kidPulse 1.5s infinite;
        }

        .kid-presence-dot.is-waiting{
            background:#f59e0b;
        }

        .kid-presence-dot.is-locked{
            background:#ef4444;
        }

        .kid-presence-dot.is-empty{
            background:#64748b;
        }

        @keyframes kidPulse{
            0%{ box-shadow:0 0 0 0 rgba(34,197,94,.55); }
            70%{ box-shadow:0 0 0 9px rgba(34,197,94,0); }
            100%{ box-shadow:0 0 0 0 rgba(34,197,94,0); }
        }

        .kid-name{
            font-weight:700;
            color:#fff;
            line-height:1.15;
            letter-spacing:.1px;
            word-break:break-word;
        }

        .kid-meta{
            display:flex;
            flex-wrap:wrap;
            gap:.45rem;
            margin-top:.45rem;
            align-items:center;
        }

        .kid-soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.45rem .75rem;
            border-radius:8px;
            font-size:.8rem;
            line-height:1;
            border:1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color:#2dd4bf;
            backdrop-filter:blur(10px);
            transition: all 0.3s ease;
        }

        .kid-soft-badge.badge-room{
            background:rgba(250,204,21,.12);
            border-color:rgba(250,204,21,.4);
            color:#fbbf24;
        }

        .kid-soft-badge.badge-user{
            border-color:rgba(59,130,246,.4);
            color:#60a5fa;
        }

        .bbb-status-pill{
            display:inline-flex;
            align-items:center;
            gap:.45rem;
            padding:.45rem .75rem;
            border-radius:8px;
            font-size:.80rem;
            font-weight:700;
            border:1px solid rgba(255,255,255,.10);
            white-space:nowrap;
            transition: all 0.3s ease;
        }

        .bbb-status-pill .dot{
            width:8px;
            height:8px;
            border-radius:50%;
            display:inline-block;
        }

        .bbb-status-pill.status-live{
            background:rgba(34,197,94,.12);
            color:#86efac;
            border-color:rgba(34,197,94,.25);
        }
        .bbb-status-pill.status-live .dot{
            background:#22c55e;
            box-shadow:0 0 0 0 rgba(34,197,94,.55);
            animation:kidPulse 1.5s infinite;
        }

        .bbb-status-pill.status-waiting{
            background:rgba(245,158,11,.12);
            color:#fcd34d;
            border-color:rgba(245,158,11,.25);
        }
        .bbb-status-pill.status-waiting .dot{ background:#f59e0b; }

        .bbb-status-pill.status-locked{
            background:rgba(239,68,68,.12);
            color:#fca5a5;
            border-color:rgba(239,68,68,.24);
        }
        .bbb-status-pill.status-locked .dot{ background:#ef4444; }

        .bbb-status-pill.status-empty{
            background:rgba(100,116,139,.18);
            color:#cbd5e1;
            border-color:rgba(148,163,184,.24);
        }
        .bbb-status-pill.status-empty .dot{ background:#94a3b8; }

        .bbb-actions{
            display:flex;
            flex-direction:column;
            align-items:flex-end;
            gap:.5rem;
            min-width:210px;
            position:relative;
            z-index:2;
        }

        .bbb-actions .btn,
        .bbb-actions a,
        .bbb-actions button{
            box-sizing:border-box;
        }

        .btn-outline-neon {
            border-color: #77c6cf;
            color: #77c6cf;
            border-radius: 8px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .btn-outline-neon:hover {
            border-color: rgba(45, 212, 191, 0.9);
            color: #fff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.3);
            transform: translateY(-2px);
        }

        .btn-join-live{
            position:relative;
            overflow:hidden;
            border-width:1px;
            border-radius:8px;
            font-weight:700;
            letter-spacing:.2px;
            transition:all .3s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.2);
        }

        .btn-join-live:hover{
            transform:translateY(-2px);
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.4);
        }

        .btn-join-live::after{
            content:"";
            position:absolute;
            top:0;
            left:-120%;
            width:80%;
            height:100%;
            transform:skewX(-20deg);
            background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
            animation:joinShine 2.4s linear infinite;
        }

        @keyframes joinShine{
            0%{ left:-120%; }
            100%{ left:140%; }
        }

        .online-hero{
            position:relative;
            overflow:hidden;
            border-radius:12px;
            background: var(--dark-gradient);
            border: 1px solid rgba(45, 212, 191, 0.2);
            box-shadow: 0 10px 40px rgba(0,0,0,.2);
        }

        .online-hero .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.4rem;
            padding:.6rem 1rem;
            border-radius:8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color:#2dd4bf;
            font-size:.80rem;
            font-weight:700;
        }

        .dashboard-kids-stack{
            display:grid;
            gap:.9rem;
        }

        .mini-note{
            font-size:.78rem;
            color:rgba(255,255,255,.62);
            line-height:1.3;
        }

        .access-warning{
            border-radius:8px;
            margin:0;
            padding:.6rem .9rem;
            font-size:.8rem;
            line-height:1.2;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
            color: #2dd4bf;
        }

        /* Cards General */
        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 12px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header {
            background: transparent !important;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        /* Alert Styles */
        .alert {
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
            backdrop-filter: blur(10px);
            transition: all 0.3s ease;
            animation: slideInDown 0.6s ease-out;
        }

        .alert-light {
            background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.03)) !important;
            border-color: rgba(255,255,255,.1) !important;
            color: rgba(255,255,255,.9) !important;
        }

        /* Badge Styles */
        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(100,116,139,.3), rgba(148,163,184,.2)) !important;
            border: 1px solid rgba(148,163,184,.4);
            color: #cbd5e1;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-info {
            background: linear-gradient(135deg, rgba(14,165,233,.3), rgba(34,197,94,.2)) !important;
            border: 1px solid rgba(14,165,233,.4);
            color: #38bdf8;
        }

        /* Button Styles */
        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.2);
        }

        .btn-outline-yellow {
            border-color: rgba(250,204,21,.5);
            color: #fbbf24;
        }

        .btn-outline-yellow:hover {
            background: rgba(250,204,21,.1);
            border-color: rgba(250,204,21,.8);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-success {
            background: linear-gradient(135deg, #34d399, #10b981);
            border: none;
        }

        .btn-success:hover {
            box-shadow: 0 0 20px rgba(52, 211, 153, 0.4);
            transform: translateY(-2px);
        }

        .bg-neon {
            color: #2dd4bf;
        }

        .parent-absence-card {
            background: var(--dark-gradient);
            border: 1px solid rgba(45, 212, 191, 0.2);
            box-shadow: 0 10px 40px rgba(0,0,0,.15);
            border-radius: 12px;
            animation: fadeIn 0.6s ease-out;
        }

        .parent-absence-card .card-header {
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
        }

        .parent-absence-card .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.1);
            margin-bottom: 0;
        }

        .parent-absence-card .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            border-bottom-color: rgba(45, 212, 191, 0.2);
        }

        .parent-absence-card .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .parent-absence-card .table tbody tr:hover {
            background: rgba(45, 212, 191, 0.05);
        }

        .absence-child-box {
            display: flex;
            align-items: center;
            gap: .75rem;
            min-width: 220px;
        }

        .absence-child-avatar {
            width: 52px;
            height: 60px;
            object-fit: cover;
            border-radius: 8px;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(255,255,255,.05);
            flex-shrink: 0;
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
        }

        .absence-child-name {
            font-size:16px ;
            font-weight: 600;
            color: #fff;
            line-height: 1.15;
        }

        .absence-child-id {
            font-size: .75rem;
            color: rgba(255,255,255,.55);
        }

        .absence-reason {
            min-width: 210px;
        }

        .absence-reason-title {
            margin-top: .35rem;
            font-size: 14px;
            font-weight: 400;
            color: rgba(255,255,255,.94);
            line-height: 1.2;
        }

        .absence-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .5rem;
            justify-content: center;
            min-width: 170px;
        }

        .absence-actions .btn,
        .absence-actions .badge {
            min-width: 110px;
            justify-content: center;
        }

        .bg-success-subtle {
            background-color: rgba(25, 135, 84, .12) !important;
            border-color: rgba(25, 135, 84, .25) !important;
        }

        .bg-danger-subtle {
            background-color: rgba(220, 53, 69, .12) !important;
            border-color: rgba(220, 53, 69, .25) !important;
        }

        .parent-absence-scroll {
            max-height: 420px;
            overflow-y: auto;
            overflow-x: auto;
            border-radius: 8px;
        }

        .parent-absence-scroll::-webkit-scrollbar {
            width: 10px;
            height: 10px;
        }

        .parent-absence-scroll::-webkit-scrollbar-thumb {
            background: rgba(45, 212, 191, 0.3);
            border-radius: 10px;
        }

        .parent-absence-scroll::-webkit-scrollbar-track {
            background: rgba(45, 212, 191, 0.05);
        }

        /* Responsive */
        @media (max-width: 1200px) {
            .dashboard-hero-title {
                font-size: 1.75rem;
            }
        }

        @media (max-width: 991.98px){
            .kid-item{
                flex-direction:column;
                align-items:stretch;
                gap:.85rem;
                padding:1.15rem;
            }

            .kid-avatar-wrap{
                align-self:flex-start;
            }

            .kid-avatar{
                width:58px;
                height:66px;
            }

            .kid-meta{
                gap:.4rem;
            }

            .kid-soft-badge{
                max-width:100%;
                white-space:normal;
                word-break:break-word;
            }

            .bbb-actions{
                align-items:stretch;
                min-width:100%;
                width:100%;
                margin-top:.35rem;
                gap:.5rem;
            }

            .bbb-actions .btn,
            .bbb-actions a,
            .bbb-actions button{
                width:100%;
                display:flex;
                align-items:center;
                justify-content:center;
                text-align:center;
                white-space:normal;
                line-height:1.25;
                padding:.75rem .9rem;
            }

            .bbb-actions .alert{
                width:100%;
                margin-bottom:0;
            }

            .bbb-status-pill{
                white-space:normal;
                line-height:1.2;
                max-width:100%;
            }

            .kid-name{
                font-size:1rem;
                line-height:1.25;
            }

            .parent-absence-table {
                min-width: 980px;
            }
        }

        @media (max-width: 767.98px) {
            .dashboard-hero {
                padding: 1.5rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }
        }

        @media (max-width: 575.98px){
            .card-body{
                padding:1rem !important;
            }

            .kid-item{
                border-radius:8px;
                padding:.9rem;
            }

            .bbb-actions .btn,
            .bbb-actions a,
            .bbb-actions button{
                font-size:.92rem;
                padding:.7rem .8rem;
            }

            .access-warning{
                font-size:.76rem;
                padding:.55rem .65rem;
            }

            .kid-soft-badge{
                font-size:.74rem;
            }

            .bbb-status-pill{
                font-size:.76rem;
                padding:.4rem .65rem;
            }

            .dashboard-hero {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }
        .last-login-card {
            overflow: hidden;
        }

        .last-login-content {
            display: flex;
            align-items: center;
            gap: 1rem;
            min-width: 0;
        }

        .last-login-avatar {
            width: 60px;
            height: 68px;
            flex: 0 0 60px;
            overflow: hidden;
            border-radius: 14px;
            background: rgba(255,255,255,.06);
        }

        .last-login-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(255,255,255,.18);
            padding: 2px;
        }

        .last-login-info {
            flex: 1 1 auto;
            min-width: 0;
        }

        .last-login-name,
        .last-login-meta,
        .last-login-ip {
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .last-login-meta {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: .5rem;
        }

        .last-login-actions {
            flex: 0 0 auto;
            display: flex;
            flex-direction: column;
            gap: .5rem;
            min-width: 170px;
        }

        @media (max-width: 767.98px) {
            .last-login-content {
                align-items: flex-start;
            }

            .last-login-actions {
                min-width: 150px;
            }
        }

        @media (max-width: 575.98px) {
            .last-login-content {
                flex-direction: column;
                align-items: stretch;
                text-align: center;
            }

            .last-login-avatar {
                margin: 0 auto;
                width: 76px;
                height: 86px;
                flex-basis: 76px;
            }

            .last-login-meta,
            .last-login-ip {
                justify-content: center;
            }

            .last-login-actions {
                width: 100%;
                min-width: 0;
            }

            .last-login-actions .btn {
                width: 100%;
                justify-content: center;
            }
        }
        .alert-heading {
            color: #77c6cf;
        }

/* ===== resources\views\parent\dashboard.blade.php :: <style> ===== */
#chartdiv {
                                width: 100%;
                                height: 300px;
                            }

/* ===== resources\views\partial\footer-guest.blade.php :: <style> ===== */
:root{
            --footer-bg: #0b0f1a;
            --footer-muted: rgba(255,255,255,.6);
            --footer-accent: #249d79;
        }

        .site-footer{
            background: var(--footer-bg);
            background-color: #2525257d !important;
        }

        /* Liens */
        .footer-link{
            color:#fff!important;
            text-decoration:none;
            font-weight:300;
            font-size:14px;
            line-height:2;
            transition:color .25s ease, opacity .25s ease;
            opacity:.7;
        }
        .footer-link:hover{ color:var(--footer-accent)!important; opacity:1; font-weight:700!important; }

        /* Texte atténué */
        .text-white-50{ color:var(--footer-muted)!important; }

        /* Logo principal */
        .footer-brand img{ max-width:240px; height:auto; }

        /* Réseaux sociaux (touch friendly) */
        .footer-social-link .avatar-title{
            width:36px;height:36px; display:flex; align-items:center; justify-content:center;
            background: rgba(255,255,255,.1); border-radius:50%;
            transition:transform .2s ease, background .2s ease, opacity .2s ease;
        }
        .footer-social-link a{ opacity:.8; }
        .footer-social-link a:hover .avatar-title{ background: rgba(255,255,255,.2); transform: translateY(-2px); }

        /* Logos paiement — grille auto-adaptative */
        .pay-logos{
            display:grid; grid-template-columns: repeat(auto-fit, minmax(56px, 1fr));
            gap:.5rem 1rem; align-items:center;
        }
        .pay-logos .logo-wrap{ display:flex; align-items:center; justify-content:center; padding:.25rem; }
        .pay-logos img{ max-height:48px; width:auto; opacity:.7; transition:opacity .2s ease, transform .2s ease; }
        .pay-logos img:hover{ opacity:1; transform:scale(1.02); }

        /* Ombre uniquement en haut, sans côtés */
        .shadow-top-only{ position:relative; }
        .shadow-top-only::before{
            content:""; position:absolute; top:-1px; left:0; right:0; height:1px; pointer-events:none;
            background: linear-gradient(to bottom, rgba(255,255,255,.45), rgba(175,175,175,.15));
            -webkit-mask-image: linear-gradient(to right, transparent, #fff 12%, #fff 88%, transparent);
            mask-image: linear-gradient(to right, transparent, #fff 12%, #fff 88%, transparent);
        }

        /* Petits écrans : centrage + espacements */
        @media (max-width: 575.98px){
            .footer-cols h5{ text-align:center; margin-top:.5rem; }
            .footer-cols ul{ text-align:center; }
            .footer-bottom .footer-list{ justify-content:center; gap:.75rem; }
        }

/* ===== resources\views\partial\header.blade.php :: <style> ===== */
:root{
        --hud-bg: #0b1220;
        --hud-bg-2: #111827;
        --hud-panel: rgba(10, 19, 36, 0.94);
        --hud-panel-2: rgba(17, 24, 39, 0.98);
        --hud-border: rgba(167, 238, 251, 0.18);
        --hud-border-strong: rgba(167, 238, 251, 0.48);
        --hud-text: #e7f8fc;
        --hud-text-soft: #98b4c0;
        --hud-neon: #a7eefb;
        --hud-neon-2: #6dd1f8;
        --hud-success: #86efac;
        --hud-danger: #fda4af;
        --hud-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.08),
            0 0 24px rgba(109, 209, 248, 0.12),
            0 22px 46px rgba(0, 0, 0, 0.58);
    }
    html, body {
        margin: 0 !important;
        padding: 0 !important;
    }

    .app,
    #app {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .app-header,
    #header {
        top: 0 !important;
        margin-top: 0 !important;
    }

    body > .app,
    body > #app {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    body {
        position: relative;
        min-height: 100vh;
    }

    body::before{
        content:"";
        position:fixed;
        inset:0;
        background:url('/assets/images/background/fond3.png') center / cover no-repeat;
        opacity:.03;
        z-index:-1;
        pointer-events:none;
    }

    .move-image{
        position:relative;
        animation:slide 3s infinite alternate ease-in-out;
    }

    @keyframes slide{
        from{ left:0px; }
        to{ left:200px; }
    }

    .text-neon {
        color: var(--hud-neon) !important;
    }

/* ===== Fix dropdown coupé / masqué ===== */
    #header,
    #header .menu,
    #header .menu-item,
    #header .dropdown,
    #header .dropdown-mobile-full,
    #header .hud-dropdown-wrap,
    .app-header,
    .app-header .menu {
        overflow: visible !important;
    }

    #header {
        position: relative;
        z-index: 1040;
    }

/* ===== Triggers ===== */
    .hud-dropdown-toggle {
        position: relative;
        border-radius: 8px;
        transition: all .25s ease;
    }

    .hud-dropdown-toggle:hover,
    .hud-dropdown-toggle:focus,
    .show > .hud-dropdown-toggle {
        filter: drop-shadow(0 0 10px rgba(109, 209, 248, 0.18));
        transform: translateY(-1px);
    }

/* ===== Wrapper + corners ===== */
    .hud-dropdown-wrap {
        position: relative;
    }

    .hud-dropdown-wrap .hud-corner {
        position: absolute;
        width: 16px;
        height: 16px;
        border-color: rgba(167, 238, 251, 0.55);
        pointer-events: none;
        z-index: 30;
        filter: drop-shadow(0 0 5px rgba(109, 209, 248, 0.20));
        opacity: 0;
        transition: opacity .25s ease;
    }

    .hud-dropdown-wrap:hover .hud-corner,
    .hud-dropdown-wrap.show .hud-corner,
    .hud-dropdown-wrap:focus-within .hud-corner {
        opacity: 1;
    }

    .hud-dropdown-wrap .hud-corner.tl {
        top: 6px;
        left: 6px;
        border-top: 2px solid;
        border-left: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.tr {
        top: 6px;
        right: 6px;
        border-top: 2px solid;
        border-right: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.bl {
        bottom: 6px;
        left: 6px;
        border-bottom: 2px solid;
        border-left: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.br {
        bottom: 6px;
        right: 6px;
        border-bottom: 2px solid;
        border-right: 2px solid;
    }

/* ===== HUD dropdown menu ===== */
    .dropdown-menu.hud-dropdown-menu {
        position: absolute;
        overflow: hidden;
        border: 1px solid var(--hud-border);
        border-radius: 8px;
        background:
            radial-gradient(circle at top right, rgba(109, 209, 248, 0.12), transparent 30%),
            radial-gradient(circle at bottom left, rgba(167, 238, 251, 0.08), transparent 28%),
            linear-gradient(145deg, var(--hud-panel) 0%, var(--hud-panel-2) 100%);
        color: var(--hud-text);
        box-shadow: var(--hud-shadow);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        padding: .45rem;
        min-width: 240px;
        margin-top: .75rem !important;
        z-index: 1085 !important;
    }

    .dropdown-menu.hud-dropdown-menu:hover {
        border-color: rgba(45, 212, 191, 0.9) !important;
        box-shadow:
            0 0 0 1px rgba(45, 212, 191, 0.35),
            0 0 18px rgba(45, 212, 191, 0.45),
            0 0 32px rgba(45, 212, 191, 0.22),
            0 18px 35px rgba(0, 0, 0, 0.45) !important;
    }

    .dropdown-menu.hud-dropdown-menu::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background:
            repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,0.025) 0px,
                rgba(255,255,255,0.025) 1px,
                transparent 2px,
                transparent 4px
            );
        opacity: .22;
        mix-blend-mode: soft-light;
    }

    .dropdown-menu.hud-dropdown-menu::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(
            115deg,
            transparent 0%,
            rgba(255,255,255,.05) 16%,
            transparent 33%
        );
        animation: hudDropdownSheen 6s linear infinite;
        opacity: .5;
    }

    @keyframes hudDropdownSheen {
        0%   { transform: translateX(-120%); }
        100% { transform: translateX(140%); }
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item {
        position: relative;
        z-index: 1;
        border-radius: 6px;
        color: var(--hud-text);
        padding: .7rem .85rem;
        font-weight: 500;
        transition:
            background .22s ease,
            color .22s ease,
            transform .18s ease,
            box-shadow .22s ease;
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item:hover,
    .dropdown-menu.hud-dropdown-menu .dropdown-item:focus {
        color: #ffffff;
        background: rgba(109, 209, 248, 0.12);
        transform: translateX(2px);
        box-shadow:
            inset 0 0 0 1px rgba(167, 238, 251, 0.16),
            0 0 12px rgba(109, 209, 248, 0.10);
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item.active,
    .dropdown-menu.hud-dropdown-menu .dropdown-item:active {
        background: linear-gradient(180deg, rgba(186, 245, 255, 0.16), rgba(134, 228, 255, 0.10));
        color: var(--hud-neon);
        box-shadow:
            inset 0 0 0 1px rgba(167, 238, 251, 0.18),
            0 0 14px rgba(109, 209, 248, 0.14);
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-divider,
    .dropdown-menu.hud-dropdown-menu hr {
        border-top-color: rgba(167, 238, 251, 0.10);
        opacity: 1;
        margin: .45rem 0;
        position: relative;
        z-index: 1;
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-header,
    .dropdown-menu.hud-dropdown-menu h6 {
        position: relative;
        z-index: 1;
        color: var(--hud-text-soft);
        font-size: .72rem;
        text-transform: uppercase;
        letter-spacing: .08em;
        padding: .45rem .85rem;
        margin-bottom: .15rem;
    }

    .dropdown-menu.hud-dropdown-menu .form-control,
    .dropdown-menu.hud-dropdown-menu .input-group-text {
        position: relative;
        z-index: 1;
        border: 1px solid rgba(167, 238, 251, 0.14);
        background: rgba(255,255,255,0.04);
        color: var(--hud-text);
        border-radius: 6px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
    }

    .dropdown-menu.hud-dropdown-menu .form-control::placeholder {
        color: rgba(231, 248, 252, 0.38);
    }

    .dropdown-menu.hud-dropdown-menu .form-control:focus {
        background: rgba(255,255,255,0.06);
        color: #fff;
        border-color: rgba(109, 209, 248, 0.88);
        box-shadow:
            0 0 0 .18rem rgba(109, 209, 248, 0.12),
            0 0 18px rgba(109, 209, 248, 0.10);
    }

    .dropdown-menu.hud-dropdown-menu .input-group-text {
        cursor: pointer;
    }

    .dropdown-menu.hud-dropdown-menu .small,
    .dropdown-menu.hud-dropdown-menu .fw-semibold,
    .dropdown-menu.hud-dropdown-menu .fw-bold,
    .dropdown-menu.hud-dropdown-menu .text-white-50,
    .dropdown-menu.hud-dropdown-menu .text-reset,
    .dropdown-menu.hud-dropdown-menu .text-inverse {
        position: relative;
        z-index: 1;
        color: var(--hud-text) !important;
    }

    .dropdown-menu.hud-dropdown-menu .text-inverse.text-opacity-50,
    .dropdown-menu.hud-dropdown-menu .small.text-inverse.text-opacity-50 {
        color: var(--hud-text-soft) !important;
    }

    .dropdown-menu.hud-dropdown-menu a {
        color: var(--hud-text);
        text-decoration: none;
    }

    .dropdown-menu.hud-dropdown-menu .badge.bg-danger {
        box-shadow: 0 0 12px rgba(239, 68, 68, 0.18);
    }

    .hud-login-btn {
        border: 1px solid rgba(167, 238, 251, 0.85);
        background: linear-gradient(180deg, #baf5ff 0%, #86e4ff 100%);
        color: #0f172a;
        font-weight: 700;
        transition: all .25s ease;
        box-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.20),
            0 0 20px rgba(109, 209, 248, 0.22);
    }

    .hud-login-btn:hover,
    .hud-login-btn:focus {
        color: #0f172a;
        border-color: #d9fbff;
        transform: translateY(-1px);
        box-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.30),
            0 0 14px rgba(109, 209, 248, 0.30),
            0 0 34px rgba(109, 209, 248, 0.26);
    }

    .pagination {
        gap: .25rem;
    }

    .pagination .page-link {
        border: none;
        border-radius: 999px;
        box-shadow: 0 1px 0 rgba(0,0,0,.05);
    }

    .pagination .page-item.active .page-link {
        color: #fff;
        background-color: var(--bs-primary);
    }

    .pagination .page-link:focus {
        box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .2);
    }

    /* Mode ARABE */
    html[dir="rtl"] .user-dropdown .dropdown-item {
        display: flex;
        flex-direction: row-reverse;
        justify-content: flex-end;
        text-align: right;
    }

    html[dir="ltr"] .user-dropdown .dropdown-item {
        display: flex;
        justify-content: flex-start;
        text-align: left;
    }

    html[dir="rtl"] .user-dropdown .dropdown-item i {
        margin-right: 2px;
        margin-left: 8px;
    }

    html[dir="rtl"] .user-dropdown .dropdown-item .ms-auto {
        margin-left: 0 !important;
    }

    html[dir="rtl"] .user-dropdown .dropdown-item {
        gap: 8px;
    }

    @media (prefers-reduced-motion: reduce){
        .move-image {
            animation:none !important;
            left:0 !important;
        }

        .dropdown-menu.hud-dropdown-menu::after {
            animation: none !important;
        }

        .hud-dropdown-toggle,
        .dropdown-menu.hud-dropdown-menu .dropdown-item {
            transition: none !important;
            transform: none !important;
        }
    }

    @media (max-width:575.98px){
        #horloge {
            display:none !important;
        }

        .brand .brand-text {
            display:none !important;
        }

        .move-image {
            animation:none !important;
            left:0 !important;
        }

        .desktop-toggler {
            display:none !important;
        }

        .app-header .ms-auto {
            gap:.5rem !important;
        }

        .app-header .img-thumbnail {
            width:28px !important;
            height:22px !important;
            padding:0 !important;
        }

        .app-header .menu-item .fw-bold.text-light {
            display:block !important;
        }

        .dropdown-menu {
            max-width:92vw;
            width:92vw;
        }

        .dropdown-menu.w-300px {
            width:92vw !important;
        }

        .dropdown-menu.hud-dropdown-menu {
            max-width: 92vw !important;
            width: 92vw !important;
        }

        #langDropdown img {
            width:28px !important;
            height:20px !important;
        }

        .dropdown-menu [role="menuitemradio"] {
            padding:.5rem .75rem;
        }

        .nav-icon, .bi {
            font-size:1rem;
            line-height:1;
        }
    }

    @media (max-width:767.98px){
        .app-header .menu .menu-item {
            margin:0 .1rem;
        }
    }

/* ===== FIX TEXTE HEADER INVISIBLE ===== */
    #header,
    #header .menu-link,
    #header .menu-link *,
    #header .brand-text,
    #header .menu-icon,
    #header .nav-icon,
    #header .bi,
    #header .fas,
    #header #horloge {
        color: var(--hud-text) !important;
    }

    #header .menu-link:hover,
    #header .menu-link:hover *,
    #header .brand-logo:hover .brand-text {
        color: var(--hud-neon) !important;
    }

    #header .brand-logo {
        color: var(--hud-text) !important;
        text-decoration: none;
    }

    #header .brand-text {
        color: var(--hud-text) !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    #header .fw-bold.text-light {
        color: var(--hud-text) !important;
    }

/* ===== FIX FINAL HEADER MENU INVISIBLE ===== */
    .app-header,
    #header {
        background: rgba(10, 19, 36, .96) !important;
        color: #e7f8fc !important;
    }

    .app-header a,
    .app-header span,
    .app-header div,
    .app-header i,
    .app-header button,
    #header a,
    #header span,
    #header div,
    #header i,
    #header button {
        color: #e7f8fc !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .app-header .brand-text,
    #header .brand-text {
        color: #a7eefb !important;
        display: inline-block !important;
    }

    .app-header .menu-link,
    #header .menu-link {
        color: #e7f8fc !important;
    }

    .app-header .menu-link:hover,
    #header .menu-link:hover {
        color: #a7eefb !important;
    }

    .app-header .menu-icon i,
    #header .menu-icon i,
    .app-header .nav-icon,
    #header .nav-icon {
        color: #a7eefb !important;
    }

    .app-header .dropdown-menu,
    #header .dropdown-menu,
    .app-header .dropdown-menu *,
    #header .dropdown-menu * {
        color: #e7f8fc !important;
    }

    .app-header .dropdown-item:hover,
    #header .dropdown-item:hover {
        color: #ffffff !important;
    }

/* ===== resources\views\partial\navigation.blade.php :: <style> ===== */
:root{
        --hud-bg: #0b1220;
        --hud-bg-2: #111827;
        --hud-panel: rgba(10, 19, 36, 0.94);
        --hud-panel-2: rgba(17, 24, 39, 0.98);
        --hud-border: rgba(167, 238, 251, 0.18);
        --hud-border-strong: rgba(167, 238, 251, 0.48);
        --hud-text: #e7f8fc;
        --hud-text-soft: #98b4c0;
        --hud-neon: #a7eefb;
        --hud-neon-2: #6dd1f8;
        --hud-success: #86efac;
        --hud-danger: #fda4af;
        --hud-shadow:
            0 0 0 1px rgba(167, 238, 251, 0.08),
            0 0 24px rgba(109, 209, 248, 0.12),
            0 22px 46px rgba(0, 0, 0, 0.58);
    }

    .app {padding-top: 0 !important}

    .move-image {
        position: relative;
        animation: slide 3s infinite alternate ease-in-out;
    }

    @keyframes slide {
        from { left: 0px; }
        to   { left: 200px; }
    }

    .text-neon {
        color: var(--hud-neon) !important;
    }

/* ===== HUD dropdown trigger ===== */
    .hud-dropdown-toggle {
        position: relative;
        border-radius: 8px;
        transition: all .25s ease;
    }

    .hud-dropdown-toggle:hover,
    .hud-dropdown-toggle:focus,
    .show > .hud-dropdown-toggle {
        filter: drop-shadow(0 0 10px rgba(109, 209, 248, 0.18));
        transform: translateY(-1px);
    }

/* ===== HUD dropdown wrapper ===== */
    .hud-dropdown-wrap {
        position: relative;
    }

    .hud-dropdown-wrap .hud-corner {
        position: absolute;
        width: 16px;
        height: 16px;
        border-color: rgba(167, 238, 251, 0.55);
        pointer-events: none;
        z-index: 20;
        filter: drop-shadow(0 0 5px rgba(109, 209, 248, 0.20));
        opacity: 0;
        transition: opacity .25s ease;
    }

    .hud-dropdown-wrap:hover .hud-corner,
    .hud-dropdown-wrap.show .hud-corner,
    .hud-dropdown-wrap:focus-within .hud-corner {
        opacity: 1;
    }

    .hud-dropdown-wrap .hud-corner.tl {
        top: 6px;
        left: 6px;
        border-top: 2px solid;
        border-left: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.tr {
        top: 6px;
        right: 6px;
        border-top: 2px solid;
        border-right: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.bl {
        bottom: 6px;
        left: 6px;
        border-bottom: 2px solid;
        border-left: 2px solid;
    }

    .hud-dropdown-wrap .hud-corner.br {
        bottom: 6px;
        right: 6px;
        border-bottom: 2px solid;
        border-right: 2px solid;
    }

/* ===== HUD dropdown menu ===== */
    .dropdown-menu.hud-dropdown-menu {
        position: absolute;
        overflow: hidden;
        border: 1px solid var(--hud-border);
        border-radius: 8px;
        background:
            radial-gradient(circle at top right, rgba(109, 209, 248, 0.12), transparent 30%),
            radial-gradient(circle at bottom left, rgba(167, 238, 251, 0.08), transparent 28%),
            linear-gradient(145deg, var(--hud-panel) 0%, var(--hud-panel-2) 100%);
        color: var(--hud-text);
        box-shadow: var(--hud-shadow);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        padding: .45rem;
        min-width: 240px;
        margin-top: .75rem !important;
        z-index: 1085 !important;
    }

    .dropdown-menu.hud-dropdown-menu:hover {
        border-color: rgba(45, 212, 191, 0.9) !important;
        box-shadow:
            0 0 0 1px rgba(45, 212, 191, 0.35),
            0 0 18px rgba(45, 212, 191, 0.45),
            0 0 32px rgba(45, 212, 191, 0.22),
            0 18px 35px rgba(0, 0, 0, 0.45) !important;
    }

    .dropdown-menu.hud-dropdown-menu::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background:
            repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,0.025) 0px,
                rgba(255,255,255,0.025) 1px,
                transparent 2px,
                transparent 4px
            );
        opacity: .22;
        mix-blend-mode: soft-light;
    }

    .dropdown-menu.hud-dropdown-menu::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(
            115deg,
            transparent 0%,
            rgba(255,255,255,.05) 16%,
            transparent 33%
        );
        animation: hudDropdownSheen 6s linear infinite;
        opacity: .5;
    }

    @keyframes hudDropdownSheen {
        0%   { transform: translateX(-120%); }
        100% { transform: translateX(140%); }
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item {
        position: relative;
        z-index: 1;
        border-radius: 6px;
        color: var(--hud-text);
        padding: .7rem .85rem;
        font-weight: 500;
        transition:
            background .22s ease,
            color .22s ease,
            transform .18s ease,
            box-shadow .22s ease;
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item:hover,
    .dropdown-menu.hud-dropdown-menu .dropdown-item:focus {
        color: #ffffff;
        background: rgba(109, 209, 248, 0.12);
        transform: translateX(2px);
        box-shadow:
            inset 0 0 0 1px rgba(167, 238, 251, 0.16),
            0 0 12px rgba(109, 209, 248, 0.10);
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-item.active,
    .dropdown-menu.hud-dropdown-menu .dropdown-item:active {
        background: linear-gradient(180deg, rgba(186, 245, 255, 0.16), rgba(134, 228, 255, 0.10));
        color: var(--hud-neon);
        box-shadow:
            inset 0 0 0 1px rgba(167, 238, 251, 0.18),
            0 0 14px rgba(109, 209, 248, 0.14);
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-divider {
        border-top-color: rgba(167, 238, 251, 0.10);
        margin: .45rem 0;
        position: relative;
        z-index: 1;
    }

    .dropdown-menu.hud-dropdown-menu .dropdown-header {
        position: relative;
        z-index: 1;
        color: var(--hud-text-soft);
        font-size: .72rem;
        text-transform: uppercase;
        letter-spacing: .08em;
        padding: .45rem .85rem;
    }

    .dropdown-menu.hud-dropdown-menu .form-control,
    .dropdown-menu.hud-dropdown-menu .input-group-text {
        position: relative;
        z-index: 1;
        border: 1px solid rgba(167, 238, 251, 0.14);
        background: rgba(255,255,255,0.04);
        color: var(--hud-text);
        border-radius: 6px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
    }

    .dropdown-menu.hud-dropdown-menu .form-control::placeholder {
        color: rgba(231, 248, 252, 0.38);
    }

    .dropdown-menu.hud-dropdown-menu .form-control:focus {
        background: rgba(255,255,255,0.06);
        color: #fff;
        border-color: rgba(109, 209, 248, 0.88);
        box-shadow:
            0 0 0 .18rem rgba(109, 209, 248, 0.12),
            0 0 18px rgba(109, 209, 248, 0.10);
    }

    .dropdown-menu.hud-dropdown-menu .input-group-text {
        cursor: pointer;
    }

    .dropdown-menu.hud-dropdown-menu .text-white-50 {
        color: var(--hud-text-soft) !important;
    }

    .dropdown-menu.hud-dropdown-menu .fw-semibold,
    .dropdown-menu.hud-dropdown-menu .fw-bold,
    .dropdown-menu.hud-dropdown-menu .small,
    .dropdown-menu.hud-dropdown-menu h6 {
        position: relative;
        z-index: 1;
        color: var(--hud-text);
    }

    /* Respecte prefers-reduced-motion */
    @media (prefers-reduced-motion: reduce) {
        .move-image { animation: none !important; left: 0 !important; }
        .dropdown-menu.hud-dropdown-menu::after { animation: none !important; }
        .hud-dropdown-toggle,
        .dropdown-menu.hud-dropdown-menu .dropdown-item {
            transition: none !important;
            transform: none !important;
        }
    }

    /* Smartphone < 576px */
    @media (max-width: 575.98px) {
        .navbar .brand-text { display: none !important; }
        .navbar .move-image { animation: none !important; left: 0 !important; }
        #horloge { display: none !important; }

        .navbar-toggler { padding: .25rem .25rem !important; }
        .navbar { min-height: 56px; }

        .navbar .ms-auto { gap: .5rem !important; }
        #langDropdown img { width: 28px !important; height: 20px !important; }
        .mini-cart-menu { width: 92vw !important; min-width: auto !important; }
        .mini-cart-items { max-height: 50vh; overflow: auto; }
        .menu-item .fw-bold.text-light { display: none !important; }

        .dropdown-menu { width: 92vw; max-width: 92vw; }
        .dropdown-menu.hud-dropdown-menu { width: 92vw; max-width: 92vw; }

        .navbar-nav .nav-optional-sm { display: none !important; }
        .navbar-nav .nav-link { padding: .35rem .5rem !important; font-size: .95rem; }
        .navbar .bi, .navbar .fas, .navbar .far { font-size: 1rem; line-height: 1; }
        .dropdown-menu [role="menuitemradio"] { padding: .5rem .75rem; }
    }

    @media (max-width: 767.98px) {
        .navbar-nav .nav-link { padding: .4rem .6rem; }
    }

/* ===== Fix dropdown coupé / masqué ===== */
    #header,
    #header .container-xxl,
    #header .navbar-collapse,
    #header .navbar-nav,
    #header .dropdown,
    #header .menu-item,
    #header .hud-dropdown-wrap {
        overflow: visible !important;
    }

    #header {
        position: relative;
        z-index: 1040;
    }

    #header .dropdown-menu.hud-dropdown-menu {
        z-index: 1085 !important;
        margin-top: .75rem !important;
        top: 100%;
    }

    /* évite qu'un parent transforme/coupe le rendu */
    #header .dropdown-menu {
        will-change: transform, opacity;
    }

    /* si un wrapper du thème coupe encore */
    .app-header,
    .app-header .container-xxl {
        overflow: visible !important;
    }

/* ===== resources\views\partial\sidebar.blade.php :: <style> ===== */
.menu-divider {
        height: 1px;
        background: rgba(255,255,255,.15); /* passe à rgba(0,0,0,.15) si fond clair */
        margin: .75rem 0;
    }

/* ===== resources\views\payment_envelopes\index.blade.php :: <style> ===== */
.hud-card {
            background: linear-gradient(180deg, rgba(18, 30, 58, 0.92), rgba(8, 16, 34, 0.94));
            border: 1px solid rgba(76, 125, 255, 0.18);
            box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
            border-radius: 1px;
        }

        .text-neon {
            color: #8ec5ff !important;
        }

        .table-dark-hud {
            --bs-table-bg: transparent;
            --bs-table-striped-bg: rgba(255, 255, 255, .02);
            --bs-table-hover-bg: rgba(255, 255, 255, .04);
            --bs-table-color: #d9ecff;
        }

        .badge-soft {
            padding: .5rem .75rem;
            border-radius: 4px;
            font-weight: 600;
        }

        .hero-box {
            border-radius: 2px;
            padding: 24px;
            background:
                radial-gradient(circle at top right, rgba(0, 184, 255, .20), transparent 30%),
                radial-gradient(circle at bottom left, rgba(92, 70, 255, .18), transparent 28%),
                linear-gradient(135deg, #214a53 0%, #18798a 100%);
            border: 1px solid rgba(120, 160, 255, .18);
        }

        .action-group .btn {
            margin-bottom: 4px;
        }

        .table-dark-hud td,
        .table-dark-hud th {
            vertical-align: middle;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\payment_envelopes\index.blade.php :: @push(css) ===== */

        .hud-card {
            background: linear-gradient(180deg, rgba(18, 30, 58, 0.92), rgba(8, 16, 34, 0.94));
            border: 1px solid rgba(76, 125, 255, 0.18);
            box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
            border-radius: 1px;
        }

        .text-neon {
            color: #8ec5ff !important;
        }

        .table-dark-hud {
            --bs-table-bg: transparent;
            --bs-table-striped-bg: rgba(255, 255, 255, .02);
            --bs-table-hover-bg: rgba(255, 255, 255, .04);
            --bs-table-color: #d9ecff;
        }

        .badge-soft {
            padding: .5rem .75rem;
            border-radius: 4px;
            font-weight: 600;
        }

        .hero-box {
            border-radius: 2px;
            padding: 24px;
            background:
                radial-gradient(circle at top right, rgba(0, 184, 255, .20), transparent 30%),
                radial-gradient(circle at bottom left, rgba(92, 70, 255, .18), transparent 28%),
                linear-gradient(135deg, #214a53 0%, #18798a 100%);
            border: 1px solid rgba(120, 160, 255, .18);
        }

        .action-group .btn {
            margin-bottom: 4px;
        }

        .table-dark-hud td,
        .table-dark-hud th {
            vertical-align: middle;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\payments\choose_amount_public.blade.php :: <style> ===== */
/* 100% transparent */
    .paypal-wrap.transparent{
        background: #2b3038;
        z-index: 111111;
        border: 0;
        padding: 0;                /* ou garde un p-2 si tu veux de l'air */
    }

/* ===== resources\views\payments\online-user.blade.php :: <style> ===== */
/* === FLIP 3D TARIFS – AVEC GLOW AU SURVOL === */

        .tarif-wrapper {
            perspective: 1200px; /* profondeur 3D */
            position: relative;
        }

        .tarif-card-flip {
            position: relative;
            width: 100%;
            min-height: 220px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        /* Rotation + glow au survol */
        .tarif-wrapper:hover .tarif-card-flip {
            transform: rotateY(180deg);
        }

        .tarif-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.35);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
            transition: box-shadow .4s ease, border-color .4s ease;
        }

        /* Glow vert HUD au survol de la carte */
        .tarif-wrapper:hover .tarif-face {
            border-color: rgba(45, 212, 191, 0.9); /* vert/menthe */
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.65),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        /* FACE AVANT */
        .tarif-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .tarif-front .tarif-count {
            font-size: 2.75rem;
            font-weight: 800;
            letter-spacing: .03em;
        }

        .tarif-front .tarif-label {
            text-transform: uppercase;
            font-size: .8rem;
            letter-spacing: .16em;
            opacity: .8;
        }

        /* FACE ARRIÈRE */
        .tarif-back {
            transform: rotateY(180deg);
        }

        .tarif-back .card-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

/* ===== resources\views\payments\online.blade.php :: <style> ===== */
/* === FLIP 3D TARIFS – AVEC GLOW AU SURVOL === */

        .tarif-wrapper {
            perspective: 1200px; /* profondeur 3D */
            position: relative;
        }

        .tarif-card-flip {
            position: relative;
            width: 100%;
            min-height: 300px;
            transform-style: preserve-3d;
            transition: transform .6s ease;
        }

        /* Rotation + glow au survol */
        .tarif-wrapper:hover .tarif-card-flip {
            transform: rotateY(180deg);
        }

        .tarif-face {
            position: absolute;
            inset: 0;
            padding: 1.25rem;
            border-radius: 16px;
            backface-visibility: hidden;
            display: flex;
            flex-direction: column;
            background: rgba(15, 23, 42, 0.96);
            border: 1px solid rgba(148, 163, 184, 0.35);
            box-shadow: 0 10px 24px rgba(0, 0, 0, 0.5);
            transition: box-shadow .4s ease, border-color .4s ease;
        }

        /* Glow vert HUD au survol de la carte */
        .tarif-wrapper:hover .tarif-face {
            border-color: rgba(45, 212, 191, 0.9); /* vert/menthe */
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.4),
                0 0 18px rgba(45, 212, 191, 0.65),
                0 18px 35px rgba(0, 0, 0, 0.8);
        }

        /* FACE AVANT */
        .tarif-front {
            justify-content: center;
            align-items: center;
            text-align: center;
            gap: .75rem;
        }

        .tarif-front .tarif-count {
            font-size: 2.75rem;
            font-weight: 800;
            letter-spacing: .03em;
        }

        .tarif-front .tarif-label {
            text-transform: uppercase;
            font-size: .8rem;
            letter-spacing: .16em;
            opacity: .8;
        }

        /* FACE ARRIÈRE */
        .tarif-back {
            transform: rotateY(180deg);
        }

        .tarif-back .card-body-inner {
            display: flex;
            flex-direction: column;
            height: 100%;
        }

/* ===== resources\views\preregistrations\index.blade.php :: <style> ===== */
/* Style "lisible" façon UEFA */
            .squad-table tbody tr { height: 72px; }
            .squad-table .avatar { width: 48px; height: 48px; object-fit: cover; }
            .squad-table .sticky-header th { position: sticky; top: 0; background: #fff; z-index: 2; box-shadow: inset 0 -1px 0 rgba(0,0,0,.06); }
            .squad-table tbody tr:hover { background: rgba(0,0,0,.03); }
            .pill { display:inline-block; padding:.35rem .6rem; border-radius:999px; font-size:.75rem; font-weight:600; line-height:1; }
            .pill-success { background:#e8f5e9; color:#1e7e34; }
            .pill-warning { background:#fff3cd; color:#856404; }
            .filters .form-control, .filters .form-select { min-width: 220px; }
            @media (max-width: 992px){ .filters { gap:.5rem!important; } }
            .table-avatar {
                width: 45px; height: 50px; object-fit: cover; border-radius: .25rem;
            }
            .sticky-toolbar { position: sticky; top: 0; z-index: 5; background: var(--bs-body-bg); padding: .75rem 0; }
            .min-col { white-space: nowrap; width: 1%; }

/* ===== resources\views\preregistrations\index.blade.php :: @push(css) ===== */
@push('css')

            /* Style "lisible" façon UEFA */
            .squad-table tbody tr { height: 72px; }
            .squad-table .avatar { width: 48px; height: 48px; object-fit: cover; }
            .squad-table .sticky-header th { position: sticky; top: 0; background: #fff; z-index: 2; box-shadow: inset 0 -1px 0 rgba(0,0,0,.06); }
            .squad-table tbody tr:hover { background: rgba(0,0,0,.03); }
            .pill { display:inline-block; padding:.35rem .6rem; border-radius:999px; font-size:.75rem; font-weight:600; line-height:1; }
            .pill-success { background:#e8f5e9; color:#1e7e34; }
            .pill-warning { background:#fff3cd; color:#856404; }
            .filters .form-control, .filters .form-select { min-width: 220px; }
            @media (max-width: 992px){ .filters { gap:.5rem!important; } }
            .table-avatar {
                width: 45px; height: 50px; object-fit: cover; border-radius: .25rem;
            }
            .sticky-toolbar { position: sticky; top: 0; z-index: 5; background: var(--bs-body-bg); padding: .75rem 0; }
            .min-col { white-space: nowrap; width: 1%; }

/* ===== resources\views\quran\read.blade.php :: <style> ===== */
:root {
            --quran-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --quran-card: rgba(15,23,42,.82);
            --quran-border: rgba(45,212,191,.18);
            --quran-cyan: #2dd4bf;
            --quran-cyan-soft: #a7eefb;
            --quran-purple: #a78bfa;
            --quran-muted: rgba(255,255,255,.58);
        }

        .quran-page {
            color: #fff;
        }

        .quran-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--quran-border);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.16), transparent 34%),
                var(--quran-bg);
            box-shadow: 0 22px 60px rgba(0,0,0,.32);
        }

        .quran-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .quran-hero > * {
            position: relative;
            z-index: 2;
        }

        .quran-title {
            font-size: clamp(1.45rem, 2.5vw, 2.35rem);
            font-weight: 850;
            letter-spacing: .3px;
            margin-bottom: .35rem;
        }

        .quran-subtitle {
            color: var(--quran-muted);
            max-width: 780px;
        }

        .quran-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .55rem .8rem;
            border-radius: 999px;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--quran-cyan-soft);
            font-weight: 700;
            font-size: .83rem;
        }

        .quran-layout {
            display: grid;
            grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
            gap: 1rem;
            align-items: start;
        }

        .quran-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--quran-border) !important;
            border-radius: 16px !important;
            background: var(--quran-bg) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,.26) !important;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .quran-card:hover {
            border-color: rgba(45,212,191,.5) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.22),
                0 0 28px rgba(45,212,191,.16),
                0 20px 52px rgba(0,0,0,.34) !important;
        }

        .quran-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
            font-weight: 800;
        }

        .quran-card .card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .section-icon {
            width: 38px;
            height: 38px;
            border-radius: 13px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--quran-cyan-soft);
        }

        .quran-box {
            direction: rtl;
            font-size: clamp(1.8rem, 3vw, 2.35rem) !important;
            line-height: 3.8rem;
            font-family: Arial, "Traditional Arabic", serif !important;
            color: #f8fafc;
            background:
                radial-gradient(circle at top, rgba(45,212,191,.055), transparent 36%),
                rgba(255,255,255,.025);
            border: 1px solid rgba(45,212,191,.12);
            border-radius: 16px;
            padding: 1.25rem;
            min-height: 380px;
        }

        .ayah {
            display: inline;
            cursor: pointer;
            padding: .12rem .3rem;
            border-radius: .45rem;
            transition: background .2s ease, box-shadow .2s ease, color .2s ease;
        }

        .ayah:hover {
            background: rgba(45,212,191,.13);
            box-shadow: 0 0 0 1px rgba(45,212,191,.14);
            color: #fff;
        }

        .ayah.is-playing {
            background: rgba(45,212,191,.18);
            box-shadow:
                0 0 0 1px rgba(45,212,191,.28),
                0 0 18px rgba(45,212,191,.16);
        }

        .ayah-num {
            font-size: 1rem;
            margin-left: .45rem;
            color: var(--quran-cyan-soft);
            cursor: pointer;
            opacity: .85;
        }

        .tajweed-ikhfa {
            color: #10b981;
            font-weight: 700;
        }

        .tajweed-idgham {
            color: #ef4444;
            font-weight: 700;
        }

        .tajweed-qalqalah {
            color: #3b82f6;
            font-weight: 700;
        }

        .quran-tools {
            position: sticky;
            top: 1rem;
        }

        .quran-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .5rem;
            padding: .65rem .85rem;
            border: 1px solid rgba(45,212,191,.24);
            border-radius: 11px;
            background: rgba(15,23,42,.62);
            color: rgba(255,255,255,.9);
            font-weight: 700;
            transition: .2s ease;
        }

        .quran-btn:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.5);
            color: #fff;
            transform: translateY(-1px);
        }

        .quran-btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a;
            border: none;
        }

        .quran-btn-primary:hover {
            color: #0f172a;
            box-shadow: 0 0 20px rgba(45,212,191,.3);
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 700;
        }

        .form-select,
        .form-control {
            border-color: rgba(45,212,191,.22) !important;
            background-color: rgba(15,23,42,.65) !important;
            color: #e5e7eb !important;
            border-radius: 10px !important;
        }

        .form-select:focus,
        .form-control:focus {
            border-color: rgba(45,212,191,.7) !important;
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.15) !important;
        }

        .debug-panel {
            border: 1px dashed rgba(250,204,21,.35);
            background: rgba(250,204,21,.06);
            border-radius: 14px;
        }

        .audio-shell {
            border: 1px solid rgba(45,212,191,.18);
            background: rgba(15,23,42,.68);
            border-radius: 16px;
            padding: 1rem;
        }

        .audio-shell audio {
            width: 100%;
            display: block;
        }

        .text-muted {
            color: var(--quran-muted) !important;
        }

        .legend-dot {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            display: inline-block;
            margin-right: .45rem;
        }

        @media (max-width: 991.98px) {
            .quran-layout {
                grid-template-columns: 1fr;
            }

            .quran-tools {
                position: static;
            }
        }

        @media (max-width: 767.98px) {
            .quran-hero,
            .quran-card,
            .audio-shell {
                border-radius: 14px !important;
            }

            .quran-box {
                font-size: 1.65rem !important;
                line-height: 3.25rem;
                padding: 1rem;
            }

            .quran-btn {
                width: 100%;
            }
        }

/* ===== resources\views\quran\read.blade.php :: @push(css) ===== */

        :root {
            --quran-bg: linear-gradient(135deg, rgba(15,23,42,.97), rgba(30,41,59,.9));
            --quran-card: rgba(15,23,42,.82);
            --quran-border: rgba(45,212,191,.18);
            --quran-cyan: #2dd4bf;
            --quran-cyan-soft: #a7eefb;
            --quran-purple: #a78bfa;
            --quran-muted: rgba(255,255,255,.58);
        }

        .quran-page {
            color: #fff;
        }

        .quran-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--quran-border);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 34%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.16), transparent 34%),
                var(--quran-bg);
            box-shadow: 0 22px 60px rgba(0,0,0,.32);
        }

        .quran-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
            background-size: 36px 36px;
            pointer-events: none;
            mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent);
        }

        .quran-hero > * {
            position: relative;
            z-index: 2;
        }

        .quran-title {
            font-size: clamp(1.45rem, 2.5vw, 2.35rem);
            font-weight: 850;
            letter-spacing: .3px;
            margin-bottom: .35rem;
        }

        .quran-subtitle {
            color: var(--quran-muted);
            max-width: 780px;
        }

        .quran-badge {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .55rem .8rem;
            border-radius: 999px;
            background: rgba(45,212,191,.1);
            border: 1px solid rgba(45,212,191,.25);
            color: var(--quran-cyan-soft);
            font-weight: 700;
            font-size: .83rem;
        }

        .quran-layout {
            display: grid;
            grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
            gap: 1rem;
            align-items: start;
        }

        .quran-card {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--quran-border) !important;
            border-radius: 16px !important;
            background: var(--quran-bg) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,.26) !important;
            transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
        }

        .quran-card:hover {
            border-color: rgba(45,212,191,.5) !important;
            box-shadow:
                0 0 0 1px rgba(45,212,191,.22),
                0 0 28px rgba(45,212,191,.16),
                0 20px 52px rgba(0,0,0,.34) !important;
        }

        .quran-card .card-header {
            background: rgba(255,255,255,.025) !important;
            border-bottom: 1px solid rgba(45,212,191,.12) !important;
            color: #fff;
            padding: 1rem 1.25rem;
            font-weight: 800;
        }

        .quran-card .card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .section-icon {
            width: 38px;
            height: 38px;
            border-radius: 13px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            border: 1px solid rgba(45,212,191,.24);
            color: var(--quran-cyan-soft);
        }

        .quran-box {
            direction: rtl;
            font-size: clamp(1.8rem, 3vw, 2.35rem) !important;
            line-height: 3.8rem;
            font-family: Arial, "Traditional Arabic", serif !important;
            color: #f8fafc;
            background:
                radial-gradient(circle at top, rgba(45,212,191,.055), transparent 36%),
                rgba(255,255,255,.025);
            border: 1px solid rgba(45,212,191,.12);
            border-radius: 16px;
            padding: 1.25rem;
            min-height: 380px;
        }

        .ayah {
            display: inline;
            cursor: pointer;
            padding: .12rem .3rem;
            border-radius: .45rem;
            transition: background .2s ease, box-shadow .2s ease, color .2s ease;
        }

        .ayah:hover {
            background: rgba(45,212,191,.13);
            box-shadow: 0 0 0 1px rgba(45,212,191,.14);
            color: #fff;
        }

        .ayah.is-playing {
            background: rgba(45,212,191,.18);
            box-shadow:
                0 0 0 1px rgba(45,212,191,.28),
                0 0 18px rgba(45,212,191,.16);
        }

        .ayah-num {
            font-size: 1rem;
            margin-left: .45rem;
            color: var(--quran-cyan-soft);
            cursor: pointer;
            opacity: .85;
        }

        .tajweed-ikhfa {
            color: #10b981;
            font-weight: 700;
        }

        .tajweed-idgham {
            color: #ef4444;
            font-weight: 700;
        }

        .tajweed-qalqalah {
            color: #3b82f6;
            font-weight: 700;
        }

        .quran-tools {
            position: sticky;
            top: 1rem;
        }

        .quran-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .5rem;
            padding: .65rem .85rem;
            border: 1px solid rgba(45,212,191,.24);
            border-radius: 11px;
            background: rgba(15,23,42,.62);
            color: rgba(255,255,255,.9);
            font-weight: 700;
            transition: .2s ease;
        }

        .quran-btn:hover {
            background: rgba(45,212,191,.1);
            border-color: rgba(45,212,191,.5);
            color: #fff;
            transform: translateY(-1px);
        }

        .quran-btn-primary {
            background: linear-gradient(135deg, #2dd4bf, #14b8a6);
            color: #0f172a;
            border: none;
        }

        .quran-btn-primary:hover {
            color: #0f172a;
            box-shadow: 0 0 20px rgba(45,212,191,.3);
        }

        .form-label {
            color: rgba(255,255,255,.82);
            font-weight: 700;
        }

        .form-select,
        .form-control {
            border-color: rgba(45,212,191,.22) !important;
            background-color: rgba(15,23,42,.65) !important;
            color: #e5e7eb !important;
            border-radius: 10px !important;
        }

        .form-select:focus,
        .form-control:focus {
            border-color: rgba(45,212,191,.7) !important;
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.15) !important;
        }

        .debug-panel {
            border: 1px dashed rgba(250,204,21,.35);
            background: rgba(250,204,21,.06);
            border-radius: 14px;
        }

        .audio-shell {
            border: 1px solid rgba(45,212,191,.18);
            background: rgba(15,23,42,.68);
            border-radius: 16px;
            padding: 1rem;
        }

        .audio-shell audio {
            width: 100%;
            display: block;
        }

        .text-muted {
            color: var(--quran-muted) !important;
        }

        .legend-dot {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            display: inline-block;
            margin-right: .45rem;
        }

        @media (max-width: 991.98px) {
            .quran-layout {
                grid-template-columns: 1fr;
            }

            .quran-tools {
                position: static;
            }
        }

        @media (max-width: 767.98px) {
            .quran-hero,
            .quran-card,
            .audio-shell {
                border-radius: 14px !important;
            }

            .quran-box {
                font-size: 1.65rem !important;
                line-height: 3.25rem;
                padding: 1rem;
            }

            .quran-btn {
                width: 100%;
            }
        }

/* ===== resources\views\reports\create.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #a7eefb;
            --hud-cyan: #a7eefb;
        }

        .report-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .report-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .report-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-section {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            margin-bottom: 1rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        textarea.form-control {
            min-height: 120px;
        }

        .form-text,
        .text-muted {
            color: rgba(255,255,255,.55) !important;
        }

        .score-card {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .score-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            color: var(--hud-cyan);
            border: 1px solid rgba(45,212,191,.24);
            margin-bottom: .75rem;
        }

        .summary-pill {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.82);
            font-size: .84rem;
            font-weight: 700;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .report-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .report-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .report-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .form-actions {
                flex-direction: column;
            }

            .form-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .report-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\reports\edit.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .report-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .report-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .report-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-section {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            margin-bottom: 1rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        textarea.form-control {
            min-height: 120px;
        }

        .score-card {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .score-icon {
            width: 42px;
            height: 42px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            color: var(--hud-cyan);
            border: 1px solid rgba(45,212,191,.24);
            margin-bottom: .75rem;
        }

        .summary-pill {
            display: inline-flex;
            align-items: center;
            gap: .4rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.82);
            font-size: .84rem;
            font-weight: 700;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .report-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .report-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .report-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .form-actions {
                flex-direction: column;
            }

            .form-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .report-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\reports\index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #a7eefb;
            --hud-cyan: #5ed8f4;
            --hud-gold: #facc15;
        }

        .bulletins-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .bulletin-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .bulletin-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06) !important;
            color: #fff;
            min-height: 43px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-select option {
            color: #111827;
        }

        .form-label {
            color: rgba(255,255,255,.72);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
            white-space: nowrap;
        }

        .badge-room {
            border-color: rgba(250,204,21,.24);
            color: #fde68a;
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-warning-soft {
            border-color: rgba(250,204,21,.24);
            color: #fde68a;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .stat-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .stat-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .stat-value {
            color: #fff;
            font-size: 1.2rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 760px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .student-name {
            color: #fff;
            font-weight: 900;
        }

        .student-sub {
            color: rgba(255,255,255,.55);
            font-size: .82rem;
        }

        .bulletin-score {
            min-width: 88px;
            justify-content: center;
            font-weight: 900;
        }

        .action-inline {
            display: flex;
            justify-content: flex-end;
            gap: .45rem;
            align-items: center;
            flex-wrap: wrap;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .pagination {
            margin-top: 1rem;
            flex-wrap: wrap;
            gap: .25rem;
        }

        .pagination .page-link {
            border-radius: 12px;
            background: rgba(255,255,255,.06);
            border-color: rgba(255,255,255,.10);
            color: #fff;
        }

        .pagination .page-item.active .page-link {
            background: var(--hud-cyan);
            border-color: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .pagination .page-link:hover {
            color: #172033;
            background: var(--hud-cyan);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .bulletins-topbar,
            .filters-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .bulletins-topbar .btn,
            .filters-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 575.98px) {
            .bulletin-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1rem;
            }

            .action-inline {
                justify-content: flex-start;
            }
        }

/* ===== resources\views\reports\show.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
        }

        .report-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .report-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .report-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .hud-subtext {
            color: var(--hud-muted);
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .info-box {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
            height: 100%;
        }

        .info-label {
            color: rgba(255,255,255,.58);
            font-size: .76rem;
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .05em;
        }

        .info-value {
            color: #fff;
            font-size: 1.08rem;
            font-weight: 900;
            margin-top: .35rem;
        }

        .score-main {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            padding: .5rem .8rem;
            border-radius: 999px;
            background: rgba(34,197,94,.12);
            border: 1px solid rgba(34,197,94,.28);
            color: #bbf7d0;
            font-weight: 900;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .criteria-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 1rem;
        }

        .criteria-card {
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .criteria-title {
            color: rgba(255,255,255,.70);
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            margin-bottom: .5rem;
        }

        .criteria-score {
            color: #fff;
            font-size: 1.35rem;
            font-weight: 900;
        }

        .remarks-box {
            border-radius: 18px;
            padding: 1.2rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            color: rgba(255,255,255,.84);
            line-height: 1.7;
            min-height: 110px;
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .report-topbar {
                flex-direction: column;
                align-items: stretch !important;
            }

            .report-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .report-actions .btn {
                width: 100%;
            }

            .criteria-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 575.98px) {
            .report-hero {
                padding: 1rem;
            }

            .criteria-grid {
                grid-template-columns: 1fr;
            }
        }

/* ===== resources\views\rooms\create.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-warning: #facc15;
        }

        .rooms-page {
            position: relative;
        }

        .rooms-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .rooms-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-muted-soft {
            color: var(--hud-muted);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .95rem 1rem;
            background: rgba(15, 23, 42, .72);
            height: 100%;
        }

        .stat-label {
            color: var(--hud-muted);
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.45rem;
            line-height: 1;
            font-weight: 900;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, .75) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .28),
                0 0 22px rgba(45, 212, 191, .24),
                0 18px 42px rgba(0, 0, 0, .42) !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .table-rooms {
            margin-bottom: 0;
            color: var(--hud-text);
        }

        .table-rooms thead th {
            color: var(--hud-blue);
            font-size: .72rem;
            text-transform: uppercase;
            letter-spacing: .05em;
            border-bottom: 1px solid var(--hud-line-strong);
            white-space: nowrap;
        }

        .table-rooms td,
        .table-rooms th {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table-rooms tbody tr {
            transition: background .2s ease;
        }

        .table-rooms tbody tr:hover {
            background: rgba(45, 212, 191, .07);
        }

        .room-icon {
            width: 36px;
            height: 36px;
            border-radius: 13px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            box-shadow: 0 0 18px rgba(45, 212, 191, .28);
        }

        .planning-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .4rem .65rem;
            border-radius: 8px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .18);
            font-size: .78rem;
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .form-control,
        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-control:focus,
        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .form-help {
            color: var(--hud-muted);
            font-size: .82rem;
        }

        .empty-state {
            padding: 2.5rem 1rem;
            text-align: center;
            color: var(--hud-muted);
        }

        .empty-state i {
            font-size: 2.3rem;
            color: var(--hud-blue);
            margin-bottom: .75rem;
        }

        .action-group {
            display: inline-flex;
            gap: .35rem;
            align-items: center;
            padding: .25rem;
            border-radius: 8px;
            border: 1px solid rgba(148, 163, 184, .14);
            background: rgba(2, 6, 23, .35);
        }

        @media (max-width: 768px) {
            .rooms-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.15rem;
            }
        }

        .table-sm>:not(caption)>*>* {
            padding: .825rem !important;
        }

/* ===== resources\views\rooms\create.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-warning: #facc15;
        }

        .rooms-page {
            position: relative;
        }

        .rooms-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .rooms-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-muted-soft {
            color: var(--hud-muted);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .95rem 1rem;
            background: rgba(15, 23, 42, .72);
            height: 100%;
        }

        .stat-label {
            color: var(--hud-muted);
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.45rem;
            line-height: 1;
            font-weight: 900;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .hud-card:hover {
            border-color: rgba(45, 212, 191, .75) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .28),
                0 0 22px rgba(45, 212, 191, .24),
                0 18px 42px rgba(0, 0, 0, .42) !important;
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .table-rooms {
            margin-bottom: 0;
            color: var(--hud-text);
        }

        .table-rooms thead th {
            color: var(--hud-blue);
            font-size: .72rem;
            text-transform: uppercase;
            letter-spacing: .05em;
            border-bottom: 1px solid var(--hud-line-strong);
            white-space: nowrap;
        }

        .table-rooms td,
        .table-rooms th {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table-rooms tbody tr {
            transition: background .2s ease;
        }

        .table-rooms tbody tr:hover {
            background: rgba(45, 212, 191, .07);
        }

        .room-icon {
            width: 36px;
            height: 36px;
            border-radius: 13px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            box-shadow: 0 0 18px rgba(45, 212, 191, .28);
        }

        .planning-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .4rem .65rem;
            border-radius: 8px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .18);
            font-size: .78rem;
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .form-control,
        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-control:focus,
        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .form-help {
            color: var(--hud-muted);
            font-size: .82rem;
        }

        .empty-state {
            padding: 2.5rem 1rem;
            text-align: center;
            color: var(--hud-muted);
        }

        .empty-state i {
            font-size: 2.3rem;
            color: var(--hud-blue);
            margin-bottom: .75rem;
        }

        .action-group {
            display: inline-flex;
            gap: .35rem;
            align-items: center;
            padding: .25rem;
            border-radius: 8px;
            border: 1px solid rgba(148, 163, 184, .14);
            background: rgba(2, 6, 23, .35);
        }

        @media (max-width: 768px) {
            .rooms-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.15rem;
            }
        }

        .table-sm>:not(caption)>*>* {
            padding: .825rem !important;
        }

/* ===== resources\views\rooms\edit.blade.php :: <style> ===== */
:root {
            --hud-card: rgba(15, 23, 42, .88);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
        }

        .rooms-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-muted-soft {
            color: var(--hud-muted);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .form-control,
        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-control:focus,
        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-help {
            color: var(--hud-muted);
            font-size: .82rem;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

/* ===== resources\views\rooms\edit.blade.php :: @push(css) ===== */

        :root {
            --hud-card: rgba(15, 23, 42, .88);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .34);
            --hud-text: #e8f3ff;
            --hud-muted: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
        }

        .rooms-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 34%),
                linear-gradient(135deg, rgba(15, 23, 42, .97), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .35);
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .text-muted-soft {
            color: var(--hud-muted);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .8rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .hud-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
        }

        .hud-card .card-header {
            border-bottom: 1px solid var(--hud-line);
            background: rgba(2, 6, 23, .46);
        }

        .form-label {
            color: var(--hud-blue);
            font-weight: 700;
        }

        .form-control,
        .form-select {
            border-color: rgba(167, 238, 251, .2);
            background-color: rgba(15, 23, 42, .86);
            color: var(--hud-text);
        }

        .form-control:focus,
        .form-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
            background-color: rgba(15, 23, 42, .96);
            color: var(--hud-text);
        }

        .form-help {
            color: var(--hud-muted);
            font-size: .82rem;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-outline-neon:hover,
        .btn-neon {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

/* ===== resources\views\rooms\index.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
            --hud-purple: #a78bfa;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .rooms-page {
            min-height: 100vh;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > .card-body,
        .hud-card > .card-header,
        .hud-card > .card-footer,
        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .rooms-hero {
            padding: 1.4rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .rooms-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .rooms-subtitle {
            color: var(--hud-muted);
            max-width: 760px;
        }

        .rooms-stat {
            height: 100%;
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .rooms-stat .label {
            font-size: .74rem;
            color: rgba(255,255,255,.55);
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .06em;
        }

        .rooms-stat .value {
            margin-top: .35rem;
            font-size: 1.08rem;
            font-weight: 900;
            color: #fff;
            line-height: 1.2;
        }

        .rooms-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .search-box {
            position: relative;
            max-width: 360px;
            width: 100%;
        }

        .search-box i {
            position: absolute;
            left: .9rem;
            top: 50%;
            transform: translateY(-50%);
            color: rgba(255,255,255,.45);
        }

        .search-box input {
            padding-left: 2.45rem;
            border-radius: 999px;
            border-color: rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .search-box input::placeholder {
            color: rgba(255,255,255,.45);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .65rem;
            border-radius: 999px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .badge-room {
            border-color: rgba(250,204,21,.24);
            color: #fde68a;
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .room-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 1rem;
        }

        .room-card {
            grid-column: span 4;
            position: relative;
            overflow: hidden;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.10);
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.10), transparent 30%),
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            padding: 1rem;
            transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
        }

        .room-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.55);
            box-shadow:
                0 0 0 1px rgba(45,212,191,.15),
                0 12px 32px rgba(0,0,0,.28);
        }

        .room-card-title {
            color: #fff;
            font-weight: 900;
            line-height: 1.2;
            margin-bottom: .35rem;
        }

        .room-card-meta {
            color: var(--hud-muted);
            font-size: .9rem;
        }

        .room-icon {
            width: 46px;
            height: 46px;
            border-radius: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            color: var(--hud-neon);
            border: 1px solid rgba(45,212,191,.22);
            font-size: 1.25rem;
        }

        .room-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .45rem;
            align-items: center;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .hud-table-card {
            overflow: hidden;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-table-card .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table-card .table thead th {
            color: #f8fafc;
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.055);
            vertical-align: middle;
            white-space: nowrap;
        }

        .hud-table-card .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table-card .table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .hud-table-card .table a {
            color: #fff;
            text-decoration: none;
        }

        .hud-table-card .table a:hover {
            color: var(--hud-cyan);
        }

        .info-list-stack {
            display: grid;
            gap: .85rem;
        }

        .info-list-item {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 1rem;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.10);
            border-radius: 20px;
            background:
                radial-gradient(circle at top right, rgba(45,212,191,.10), transparent 32%),
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
        }

        .info-list-main {
            min-width: 0;
            flex: 1;
        }

        .info-list-name {
            font-weight: 900;
            color: var(--hud-cyan);
            line-height: 1.2;
        }

        .info-list-sub {
            color: var(--hud-muted);
            font-size: .88rem;
            margin-top: .35rem;
            line-height: 1.45;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 1199.98px) {
            .room-card {
                grid-column: span 6;
            }
        }

        @media (max-width: 767.98px) {
            .rooms-hero {
                padding: 1rem;
            }

            .room-card {
                grid-column: span 12;
            }

            .rooms-toolbar {
                align-items: stretch;
            }

            .search-box {
                max-width: 100%;
            }

            .info-list-item {
                flex-direction: column;
                align-items: stretch;
            }

            .room-actions .btn,
            .room-actions form,
            .room-actions form button {
                width: 100%;
            }
        }

/* ===== resources\views\rooms\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
            --hud-purple: #a78bfa;
        }

        .dt-buttons,
        .dt-length {
            display: none !important;
            visibility: hidden !important;
        }

        .rooms-page {
            min-height: 100vh;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > .card-body,
        .hud-card > .card-header,
        .hud-card > .card-footer,
        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .rooms-hero {
            padding: 1.4rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .rooms-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .rooms-subtitle {
            color: var(--hud-muted);
            max-width: 760px;
        }

        .rooms-stat {
            height: 100%;
            border-radius: 18px;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.045);
        }

        .rooms-stat .label {
            font-size: .74rem;
            color: rgba(255,255,255,.55);
            text-transform: uppercase;
            font-weight: 800;
            letter-spacing: .06em;
        }

        .rooms-stat .value {
            margin-top: .35rem;
            font-size: 1.08rem;
            font-weight: 900;
            color: #fff;
            line-height: 1.2;
        }

        .rooms-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .search-box {
            position: relative;
            max-width: 360px;
            width: 100%;
        }

        .search-box i {
            position: absolute;
            left: .9rem;
            top: 50%;
            transform: translateY(-50%);
            color: rgba(255,255,255,.45);
        }

        .search-box input {
            padding-left: 2.45rem;
            border-radius: 999px;
            border-color: rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: #fff;
        }

        .search-box input::placeholder {
            color: rgba(255,255,255,.45);
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .65rem;
            border-radius: 999px;
            font-size: .78rem;
            line-height: 1;
            border: 1px solid rgba(255,255,255,.10);
            background: rgba(255,255,255,.06);
            color: rgba(255,255,255,.88);
        }

        .badge-room {
            border-color: rgba(250,204,21,.24);
            color: #fde68a;
        }

        .badge-info-soft {
            border-color: rgba(59,130,246,.24);
            color: #bfdbfe;
        }

        .badge-success-soft {
            border-color: rgba(34,197,94,.24);
            color: #bbf7d0;
        }

        .badge-danger-soft {
            border-color: rgba(239,68,68,.24);
            color: #fecaca;
        }

        .room-grid {
            display: grid;
            grid-template-columns: repeat(12, 1fr);
            gap: 1rem;
        }

        .room-card {
            grid-column: span 4;
            position: relative;
            overflow: hidden;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.10);
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.10), transparent 30%),
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            padding: 1rem;
            transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
        }

        .room-card:hover {
            transform: translateY(-3px);
            border-color: rgba(45,212,191,.55);
            box-shadow:
                0 0 0 1px rgba(45,212,191,.15),
                0 12px 32px rgba(0,0,0,.28);
        }

        .room-card-title {
            color: #fff;
            font-weight: 900;
            line-height: 1.2;
            margin-bottom: .35rem;
        }

        .room-card-meta {
            color: var(--hud-muted);
            font-size: .9rem;
        }

        .room-icon {
            width: 46px;
            height: 46px;
            border-radius: 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(45,212,191,.12);
            color: var(--hud-neon);
            border: 1px solid rgba(45,212,191,.22);
            font-size: 1.25rem;
        }

        .room-actions {
            display: flex;
            flex-wrap: wrap;
            gap: .45rem;
            align-items: center;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .hud-table-card {
            overflow: hidden;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .hud-table-card .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table-card .table thead th {
            color: #f8fafc;
            font-size: .82rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            border-bottom-width: 1px;
            background: rgba(255,255,255,.055);
            vertical-align: middle;
            white-space: nowrap;
        }

        .hud-table-card .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table-card .table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .hud-table-card .table a {
            color: #fff;
            text-decoration: none;
        }

        .hud-table-card .table a:hover {
            color: var(--hud-cyan);
        }

        .info-list-stack {
            display: grid;
            gap: .85rem;
        }

        .info-list-item {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 1rem;
            padding: 1rem;
            border: 1px solid rgba(255,255,255,.10);
            border-radius: 20px;
            background:
                radial-gradient(circle at top right, rgba(45,212,191,.10), transparent 32%),
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
        }

        .info-list-main {
            min-width: 0;
            flex: 1;
        }

        .info-list-name {
            font-weight: 900;
            color: var(--hud-cyan);
            line-height: 1.2;
        }

        .info-list-sub {
            color: var(--hud-muted);
            font-size: .88rem;
            margin-top: .35rem;
            line-height: 1.45;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 1199.98px) {
            .room-card {
                grid-column: span 6;
            }
        }

        @media (max-width: 767.98px) {
            .rooms-hero {
                padding: 1rem;
            }

            .room-card {
                grid-column: span 12;
            }

            .rooms-toolbar {
                align-items: stretch;
            }

            .search-box {
                max-width: 100%;
            }

            .info-list-item {
                flex-direction: column;
                align-items: stretch;
            }

            .room-actions .btn,
            .room-actions form,
            .room-actions form button {
                width: 100%;
            }
        }

/* ===== resources\views\rooms\show.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #9dd5dc;
            --neon-purple: #9dd5dc;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .btn-outline-neon {
            border-color: var(--neon-cyan);
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
        }

        .btn-outline-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            background-color: var(--neon-cyan);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: var(--neon-cyan);
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            color: #303c61;
            font-weight: 600;
            transition: var(--transition-smooth);
        }

        .btn-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            box-shadow: 0 0 25px rgba(45, 212, 191, 0.5);
            transform: translateY(-2px);
        }

        .text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 600;
        }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        .dt-buttons{display:none!important;visibility:hidden!important;}
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .rooms-dark-card{
            border:1px solid rgba(148,163,184,.20);
            border-radius:1px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            transition: var(--transition-smooth);
        }

        .rooms-dark-card:hover {
            border-color: rgba(45, 212, 191, 0.3) !important;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .rooms-dark-card::before{
            content:"";
            position:absolute;
            inset:0;

            pointer-events:none;
        }

        .rooms-dark-card .card-body,
        .rooms-dark-card .card-header,
        .rooms-dark-card .card-footer{
            position:relative;
            z-index:2;
        }

        .rooms-dark-card .card-header{
            border-bottom:1px solid rgba(255,255,255,.07);
            background:transparent;
        }

        .rooms-header-title{
            color:#fff;
            font-weight:700;
            text-transform:uppercase;
            letter-spacing:.4px;
        }

        .soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.35rem .6rem;
            border-radius:12px;
            font-size:.78rem;
            line-height:1;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            color:rgba(255,255,255,.88);
            backdrop-filter:blur(4px);
            transition: var(--transition-smooth);
        }

        .soft-badge:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .soft-badge.badge-room{
            background:rgba(255,255,255,.04);
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .soft-badge.badge-blue{
            border-color:rgba(59,130,246,.22);
            color:#bfdbfe;
        }

        .soft-badge.badge-green{
            border-color:rgba(34,197,94,.22);
            color:#bbf7d0;
        }

        .soft-badge.badge-red{
            border-color:rgba(239,68,68,.22);
            color:#fecaca;
        }

        .soft-badge.badge-yellow{
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .text-soft{
            color:rgba(255,255,255,.70) !important;
        }

        .text-soft-2{
            color:rgba(255,255,255,.58) !important;
        }

        .room-hero{
            position:relative;
            overflow:hidden;
            border-radius:12px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border:1px solid rgba(148,163,184,.18);
            box-shadow:0 10px 30px rgba(0,0,0,.08);
            transition: var(--transition-smooth);
        }

        .room-hero:hover {
            border-color: rgba(45, 212, 191, 0.2);
            box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12);
        }

        .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.4rem;
            padding:.45rem .75rem;
            border-radius:12px;
            background:#111827;
            color:#fff;
            font-size:.80rem;
            font-weight:700;
            transition: var(--transition-smooth);
        }

        .hero-chip:hover {
            background: rgba(45, 212, 191, 0.15);
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
        }

        .room-stat-box{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            padding:1rem;
            height:100%;
            transition: var(--transition-smooth);
            position: relative;
            overflow: hidden;
        }

        .room-stat-box:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .room-stat-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .room-stat-box .label{
            font-size:.78rem;
            text-transform:uppercase;
            color:rgba(255,255,255,.60);
            font-weight:700;
            letter-spacing:.05em;
            position: relative;
            z-index: 2;
        }

        .room-stat-box .value{
            margin-top:.35rem;
            font-size:1.08rem;
            font-weight:800;
            color:#fff;
            line-height:1.2;
            position: relative;
            z-index: 2;
        }

        .room-switcher-box{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            padding:1rem;
            transition: var(--transition-smooth);
            position: relative;
            overflow: hidden;
        }

        .room-switcher-box:hover {
            border-color: rgba(45, 212, 191, 0.2);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 12px 35px rgba(45, 212, 191, 0.1);
        }

        .room-switcher-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .room-switcher-box label{
            color:#fff;
            font-size:.80rem;
            font-weight:700;
            text-transform:uppercase;
            margin-bottom:.45rem;
            position: relative;
            z-index: 2;
        }

        .room-switcher-box .form-select{
            min-height:48px;
            border:1px solid rgba(255,255,255,.10);
            border-radius:12px;
            color:#fff !important;
            background:rgba(255,255,255,.06) !important;
            box-shadow:none;
            transition: var(--transition-smooth);
            position: relative;
            z-index: 2;
        }

        .room-switcher-box .form-select:hover,
        .room-switcher-box .form-select:focus {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
        }

        .room-switcher-box .form-select option{
            color:#111827;
            background:#fff;
        }

        .action-grid{
            display:grid;
            grid-template-columns: repeat(1, minmax(0,1fr));
            gap:.85rem;
        }

        @media (min-width: 768px){
            .action-grid{
                grid-template-columns: repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 1200px){
            .action-grid{
                grid-template-columns: repeat(3, minmax(0,1fr));
            }
        }

        .action-tile{
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1rem;
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            position:relative;
            overflow:hidden;
            text-decoration:none;
        }

        .action-tile:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            text-decoration:none;
        }

        .action-tile::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .action-icon{
            width:52px;
            height:52px;
            border-radius:12px;
            flex-shrink:0;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:1.2rem;
            color:#fff;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            position:relative;
            z-index:2;
            transition: var(--transition-smooth);
        }

        .action-tile:hover .action-icon {
            border-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.08);
        }

        .action-content{
            min-width:0;
            flex:1;
            position:relative;
            z-index:2;
        }

        .action-title{
            color:#fff;
            font-weight:700;
            line-height:1.15;
        }

        .action-subtitle{
            margin-top:.25rem;
            font-size:.82rem;
            color:rgba(255,255,255,.62);
            line-height:1.25;
        }

        .action-count{
            min-width:34px;
            height:34px;
            border-radius:999px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            padding:0 .55rem;
            font-size:.78rem;
            font-weight:800;
            color:#111827;
            background:#fff;
            position:relative;
            z-index:2;
            flex-shrink:0;
        }

        .dashboard-kids-stack{
            display:grid;
            gap:.9rem;
        }

        .kid-item{
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1rem;
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            position:relative;
            overflow:hidden;
        }

        .kid-item,
        .kid-item *{
            min-width:0;
        }

        .kid-item:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .kid-item::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .kid-avatar-wrap{
            position:relative;
            flex-shrink:0;
        }

        .kid-avatar{
            width:64px;
            height:72px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            transition: var(--transition-smooth);
        }

        .kid-item:hover .kid-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .kid-name{
            font-weight:700;
            color:#fff;
            line-height:1.15;
            letter-spacing:.1px;
            word-break:break-word;
        }

        .kid-meta{
            display:flex;
            flex-wrap:wrap;
            gap:.45rem;
            margin-top:.45rem;
            align-items:center;
        }

        .kid-soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.35rem .6rem;
            border-radius:12px;
            font-size:.78rem;
            line-height:1;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            color:rgba(255,255,255,.88);
            backdrop-filter:blur(4px);
            transition: var(--transition-smooth);
        }

        .kid-soft-badge:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .kid-soft-badge.badge-room{
            background:rgba(255,255,255,.04);
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .kid-soft-badge.badge-user{
            background:rgba(255,255,255,.04);
        }

        .kid-soft-badge.badge-blue{
            border-color:rgba(59,130,246,.22);
            color:#bfdbfe;
        }

        .kid-soft-badge.badge-green{
            border-color:rgba(34,197,94,.22);
            color:#bbf7d0;
        }

        .kid-soft-badge.badge-red{
            border-color:rgba(239,68,68,.22);
            color:#fecaca;
        }

        .student-actions{
            display:flex;
            flex-direction:column;
            align-items:flex-end;
            gap:.55rem;
            min-width:220px;
            position:relative;
            z-index:2;
        }

        .student-actions .btn,
        .student-actions a,
        .student-actions button{
            box-sizing:border-box;
        }

        .student-inline-actions{
            display:flex;
            flex-wrap:wrap;
            gap:.5rem;
            justify-content:flex-end;
        }

        .mini-note{
            font-size:.78rem;
            color:rgba(255,255,255,.62);
            line-height:1.3;
        }

        .student-simple-grid{
            display:grid;
            gap:.9rem;
            grid-template-columns:repeat(1, minmax(0,1fr));
        }

        @media (min-width: 576px){
            .student-simple-grid{
                grid-template-columns:repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 992px){
            .student-simple-grid{
                grid-template-columns:repeat(3, minmax(0,1fr));
            }
        }

        .student-simple-card{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            text-align:center;
            padding:1rem;
            transition: var(--transition-smooth);
        }

        .student-simple-card:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            transform: translateY(-4px);
        }

        .student-simple-card::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .student-simple-card > *{
            position:relative;
            z-index:2;
        }

        .student-simple-avatar{
            width:92px;
            height:106px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            margin-bottom:.85rem;
            transition: var(--transition-smooth);
        }

        .student-simple-card:hover .student-simple-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .student-simple-name{
            color:#fff;
            font-weight:700;
            line-height:1.15;
        }

        .student-simple-meta{
            margin-top:.35rem;
            font-size:.80rem;
            color:rgba(255,255,255,.62);
        }

        .view-toggle-group{
            display:flex;
            flex-wrap:wrap;
            gap:.5rem;
        }

        .view-toggle-btn{
            display:inline-flex;
            align-items:center;
            gap:.45rem;
            padding:.45rem .8rem;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.12);
            background:rgba(255,255,255,.05);
            color:#fff;
            text-decoration:none;
            font-size:.82rem;
            font-weight:700;
            transition: var(--transition-smooth);
        }

        .view-toggle-btn:hover{
            text-decoration:none;
            color:#fff;
            border-color:rgba(45, 212, 191, 0.3);
            background:rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .view-toggle-btn.active{
            background:linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(45, 212, 191, 0.1));
            border-color:rgba(45, 212, 191, 0.4);
            color:#2dd4bf;
        }

        .students-cards-grid{
            display:grid;
            gap:1rem;
            grid-template-columns:repeat(1, minmax(0,1fr));
        }

        @media (min-width: 768px){
            .students-cards-grid{
                grid-template-columns:repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 1200px){
            .students-cards-grid{
                grid-template-columns:repeat(3, minmax(0,1fr));
            }
        }

        .student-card-view{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            padding:1rem;
            display:flex;
            flex-direction:column;
            text-align:center;
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .student-card-view::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .student-card-view > *{
            position:relative;
            z-index:2;
        }

        .student-card-view:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .student-card-avatar{
            width:96px;
            height:110px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            margin:0 auto .9rem;
            transition: var(--transition-smooth);
        }

        .student-card-view:hover .student-card-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .student-card-name{
            color:#fff;
            font-weight:800;
            line-height:1.15;
            margin-bottom:.35rem;
            word-break:break-word;
        }

        .student-card-meta{
            font-size:.80rem;
            color:rgba(255,255,255,.62);
            margin-bottom:.75rem;
        }

        .student-card-badges{
            display:flex;
            flex-wrap:wrap;
            justify-content:center;
            gap:.45rem;
            margin-bottom:.9rem;
        }

        .student-card-actions{
            display:grid;
            grid-template-columns:repeat(2, minmax(0,1fr));
            gap:.5rem;
            margin-top:auto;
        }

        .student-card-actions .btn{
            width:100%;
        }

        #modal-global .modal-content,
        #homeworkTabsModal .modal-content{
            border:0;
            border-radius: 12px;
            box-shadow:0 16px 40px rgba(0,0,0,.20);
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
        }

        #modal-global .modal-header,
        #homeworkTabsModal .modal-header{
            background:linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            color:#fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
        }

        .bulk-toolbar{
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            border-radius:12px;
            padding:.85rem 1rem;
            transition: var(--transition-smooth);
        }

        .bulk-toolbar:hover {
            border-color: rgba(45, 212, 191, 0.15);
            background: rgba(45, 212, 191, 0.05);
        }

        .student-check-wrap{
            position:relative;
            z-index:3;
            display:flex;
            align-items:center;
            justify-content:flex-start;
        }

        @media (max-width: 991.98px){
            .kid-item{
                flex-direction:column;
                align-items:stretch;
                gap:.85rem;
                padding:.9rem;
            }

            .kid-avatar-wrap{
                align-self:flex-start;
            }

            .kid-avatar{
                width:58px;
                height:66px;
            }

            .kid-meta{
                gap:.4rem;
            }

            .kid-soft-badge{
                max-width:100%;
                white-space:normal;
                word-break:break-word;
            }

            .student-actions{
                align-items:stretch;
                min-width:100%;
                width:100%;
                margin-top:.35rem;
            }

            .student-inline-actions{
                justify-content:stretch;
                display:grid;
                grid-template-columns:repeat(2, minmax(0,1fr));
            }

            .student-inline-actions .btn,
            .student-inline-actions a,
            .student-inline-actions button{
                width:100%;
            }

            .action-tile{
                padding:.9rem;
            }
        }

        @media (max-width: 575.98px){
            .card-body{
                padding:.9rem;
            }

            .kid-item,
            .student-simple-card,
            .student-card-view,
            .action-tile,
            .room-stat-box,
            .room-switcher-box,
            .rooms-dark-card,
            .room-hero{
                border-radius:12px;
            }

            .student-inline-actions{
                grid-template-columns:repeat(1, minmax(0,1fr));
            }

            .student-simple-avatar{
                width:84px;
                height:98px;
            }

            .student-card-actions{
                grid-template-columns:repeat(1, minmax(0,1fr));
            }
        }

        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\rooms\show.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #9dd5dc;
            --neon-purple: #9dd5dc;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .btn-outline-neon {
            border-color: var(--neon-cyan);
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
        }

        .btn-outline-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            background-color: var(--neon-cyan);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: var(--neon-cyan);
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            color: #303c61;
            font-weight: 600;
            transition: var(--transition-smooth);
        }

        .btn-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            box-shadow: 0 0 25px rgba(45, 212, 191, 0.5);
            transform: translateY(-2px);
        }

        .text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 600;
        }

        .form-select, select {
            color: #498ed3;
            background-color: transparent !important;
        }

        .dt-buttons{display:none!important;visibility:hidden!important;}
        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .rooms-dark-card{
            border:1px solid rgba(148,163,184,.20);
            border-radius:1px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            transition: var(--transition-smooth);
        }

        .rooms-dark-card:hover {
            border-color: rgba(45, 212, 191, 0.3) !important;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .rooms-dark-card::before{
            content:"";
            position:absolute;
            inset:0;

            pointer-events:none;
        }

        .rooms-dark-card .card-body,
        .rooms-dark-card .card-header,
        .rooms-dark-card .card-footer{
            position:relative;
            z-index:2;
        }

        .rooms-dark-card .card-header{
            border-bottom:1px solid rgba(255,255,255,.07);
            background:transparent;
        }

        .rooms-header-title{
            color:#fff;
            font-weight:700;
            text-transform:uppercase;
            letter-spacing:.4px;
        }

        .soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.35rem .6rem;
            border-radius:12px;
            font-size:.78rem;
            line-height:1;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            color:rgba(255,255,255,.88);
            backdrop-filter:blur(4px);
            transition: var(--transition-smooth);
        }

        .soft-badge:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .soft-badge.badge-room{
            background:rgba(255,255,255,.04);
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .soft-badge.badge-blue{
            border-color:rgba(59,130,246,.22);
            color:#bfdbfe;
        }

        .soft-badge.badge-green{
            border-color:rgba(34,197,94,.22);
            color:#bbf7d0;
        }

        .soft-badge.badge-red{
            border-color:rgba(239,68,68,.22);
            color:#fecaca;
        }

        .soft-badge.badge-yellow{
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .text-soft{
            color:rgba(255,255,255,.70) !important;
        }

        .text-soft-2{
            color:rgba(255,255,255,.58) !important;
        }

        .room-hero{
            position:relative;
            overflow:hidden;
            border-radius:12px;
            background:
                radial-gradient(circle at top right, rgba(250,204,21,.12), transparent 34%),
                linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
            border:1px solid rgba(148,163,184,.18);
            box-shadow:0 10px 30px rgba(0,0,0,.08);
            transition: var(--transition-smooth);
        }

        .room-hero:hover {
            border-color: rgba(45, 212, 191, 0.2);
            box-shadow: 0 12px 35px rgba(0, 0, 0, 0.12);
        }

        .hero-chip{
            display:inline-flex;
            align-items:center;
            gap:.4rem;
            padding:.45rem .75rem;
            border-radius:12px;
            background:#111827;
            color:#fff;
            font-size:.80rem;
            font-weight:700;
            transition: var(--transition-smooth);
        }

        .hero-chip:hover {
            background: rgba(45, 212, 191, 0.15);
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
        }

        .room-stat-box{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            padding:1rem;
            height:100%;
            transition: var(--transition-smooth);
            position: relative;
            overflow: hidden;
        }

        .room-stat-box:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .room-stat-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .room-stat-box .label{
            font-size:.78rem;
            text-transform:uppercase;
            color:rgba(255,255,255,.60);
            font-weight:700;
            letter-spacing:.05em;
            position: relative;
            z-index: 2;
        }

        .room-stat-box .value{
            margin-top:.35rem;
            font-size:1.08rem;
            font-weight:800;
            color:#fff;
            line-height:1.2;
            position: relative;
            z-index: 2;
        }

        .room-switcher-box{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            padding:1rem;
            transition: var(--transition-smooth);
            position: relative;
            overflow: hidden;
        }

        .room-switcher-box:hover {
            border-color: rgba(45, 212, 191, 0.2);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 12px 35px rgba(45, 212, 191, 0.1);
        }

        .room-switcher-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .room-switcher-box label{
            color:#fff;
            font-size:.80rem;
            font-weight:700;
            text-transform:uppercase;
            margin-bottom:.45rem;
            position: relative;
            z-index: 2;
        }

        .room-switcher-box .form-select{
            min-height:48px;
            border:1px solid rgba(255,255,255,.10);
            border-radius:12px;
            color:#fff !important;
            background:rgba(255,255,255,.06) !important;
            box-shadow:none;
            transition: var(--transition-smooth);
            position: relative;
            z-index: 2;
        }

        .room-switcher-box .form-select:hover,
        .room-switcher-box .form-select:focus {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
        }

        .room-switcher-box .form-select option{
            color:#111827;
            background:#fff;
        }

        .action-grid{
            display:grid;
            grid-template-columns: repeat(1, minmax(0,1fr));
            gap:.85rem;
        }

        @media (min-width: 768px){
            .action-grid{
                grid-template-columns: repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 1200px){
            .action-grid{
                grid-template-columns: repeat(3, minmax(0,1fr));
            }
        }

        .action-tile{
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1rem;
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            position:relative;
            overflow:hidden;
            text-decoration:none;
        }

        .action-tile:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            text-decoration:none;
        }

        .action-tile::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .action-icon{
            width:52px;
            height:52px;
            border-radius:12px;
            flex-shrink:0;
            display:flex;
            align-items:center;
            justify-content:center;
            font-size:1.2rem;
            color:#fff;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            position:relative;
            z-index:2;
            transition: var(--transition-smooth);
        }

        .action-tile:hover .action-icon {
            border-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.08);
        }

        .action-content{
            min-width:0;
            flex:1;
            position:relative;
            z-index:2;
        }

        .action-title{
            color:#fff;
            font-weight:700;
            line-height:1.15;
        }

        .action-subtitle{
            margin-top:.25rem;
            font-size:.82rem;
            color:rgba(255,255,255,.62);
            line-height:1.25;
        }

        .action-count{
            min-width:34px;
            height:34px;
            border-radius:999px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            padding:0 .55rem;
            font-size:.78rem;
            font-weight:800;
            color:#111827;
            background:#fff;
            position:relative;
            z-index:2;
            flex-shrink:0;
        }

        .dashboard-kids-stack{
            display:grid;
            gap:.9rem;
        }

        .kid-item{
            display:flex;
            align-items:center;
            gap:1rem;
            padding:1rem;
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            position:relative;
            overflow:hidden;
        }

        .kid-item,
        .kid-item *{
            min-width:0;
        }

        .kid-item:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .kid-item::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .kid-avatar-wrap{
            position:relative;
            flex-shrink:0;
        }

        .kid-avatar{
            width:64px;
            height:72px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            transition: var(--transition-smooth);
        }

        .kid-item:hover .kid-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .kid-name{
            font-weight:700;
            color:#fff;
            line-height:1.15;
            letter-spacing:.1px;
            word-break:break-word;
        }

        .kid-meta{
            display:flex;
            flex-wrap:wrap;
            gap:.45rem;
            margin-top:.45rem;
            align-items:center;
        }

        .kid-soft-badge{
            display:inline-flex;
            align-items:center;
            gap:.35rem;
            padding:.35rem .6rem;
            border-radius:12px;
            font-size:.78rem;
            line-height:1;
            border:1px solid rgba(255,255,255,.10);
            background:rgba(255,255,255,.06);
            color:rgba(255,255,255,.88);
            backdrop-filter:blur(4px);
            transition: var(--transition-smooth);
        }

        .kid-soft-badge:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .kid-soft-badge.badge-room{
            background:rgba(255,255,255,.04);
            border-color:rgba(250,204,21,.22);
            color:#fde68a;
        }

        .kid-soft-badge.badge-user{
            background:rgba(255,255,255,.04);
        }

        .kid-soft-badge.badge-blue{
            border-color:rgba(59,130,246,.22);
            color:#bfdbfe;
        }

        .kid-soft-badge.badge-green{
            border-color:rgba(34,197,94,.22);
            color:#bbf7d0;
        }

        .kid-soft-badge.badge-red{
            border-color:rgba(239,68,68,.22);
            color:#fecaca;
        }

        .student-actions{
            display:flex;
            flex-direction:column;
            align-items:flex-end;
            gap:.55rem;
            min-width:220px;
            position:relative;
            z-index:2;
        }

        .student-actions .btn,
        .student-actions a,
        .student-actions button{
            box-sizing:border-box;
        }

        .student-inline-actions{
            display:flex;
            flex-wrap:wrap;
            gap:.5rem;
            justify-content:flex-end;
        }

        .mini-note{
            font-size:.78rem;
            color:rgba(255,255,255,.62);
            line-height:1.3;
        }

        .student-simple-grid{
            display:grid;
            gap:.9rem;
            grid-template-columns:repeat(1, minmax(0,1fr));
        }

        @media (min-width: 576px){
            .student-simple-grid{
                grid-template-columns:repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 992px){
            .student-simple-grid{
                grid-template-columns:repeat(3, minmax(0,1fr));
            }
        }

        .student-simple-card{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            text-align:center;
            padding:1rem;
            transition: var(--transition-smooth);
        }

        .student-simple-card:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
            transform: translateY(-4px);
        }

        .student-simple-card::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .student-simple-card > *{
            position:relative;
            z-index:2;
        }

        .student-simple-avatar{
            width:92px;
            height:106px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            margin-bottom:.85rem;
            transition: var(--transition-smooth);
        }

        .student-simple-card:hover .student-simple-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .student-simple-name{
            color:#fff;
            font-weight:700;
            line-height:1.15;
        }

        .student-simple-meta{
            margin-top:.35rem;
            font-size:.80rem;
            color:rgba(255,255,255,.62);
        }

        .view-toggle-group{
            display:flex;
            flex-wrap:wrap;
            gap:.5rem;
        }

        .view-toggle-btn{
            display:inline-flex;
            align-items:center;
            gap:.45rem;
            padding:.45rem .8rem;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.12);
            background:rgba(255,255,255,.05);
            color:#fff;
            text-decoration:none;
            font-size:.82rem;
            font-weight:700;
            transition: var(--transition-smooth);
        }

        .view-toggle-btn:hover{
            text-decoration:none;
            color:#fff;
            border-color:rgba(45, 212, 191, 0.3);
            background:rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .view-toggle-btn.active{
            background:linear-gradient(135deg, rgba(45, 212, 191, 0.2), rgba(45, 212, 191, 0.1));
            border-color:rgba(45, 212, 191, 0.4);
            color:#2dd4bf;
        }

        .students-cards-grid{
            display:grid;
            gap:1rem;
            grid-template-columns:repeat(1, minmax(0,1fr));
        }

        @media (min-width: 768px){
            .students-cards-grid{
                grid-template-columns:repeat(2, minmax(0,1fr));
            }
        }

        @media (min-width: 1200px){
            .students-cards-grid{
                grid-template-columns:repeat(3, minmax(0,1fr));
            }
        }

        .student-card-view{
            border:1px solid rgba(148,163,184,.20);
            border-radius:12px;
            background:
                linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position:relative;
            overflow:hidden;
            padding:1rem;
            display:flex;
            flex-direction:column;
            text-align:center;
            transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .student-card-view::before{
            content:"";
            position:absolute;
            inset:0;
            background:radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events:none;
        }

        .student-card-view > *{
            position:relative;
            z-index:2;
        }

        .student-card-view:hover{
            transform:translateY(-4px);
            border-color:rgba(45, 212, 191, 0.4);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .student-card-avatar{
            width:96px;
            height:110px;
            object-fit:cover;
            border-radius:12px;
            border:1px solid rgba(255,255,255,.14);
            background:rgba(255,255,255,.05);
            box-shadow:0 8px 18px rgba(0,0,0,.22);
            margin:0 auto .9rem;
            transition: var(--transition-smooth);
        }

        .student-card-view:hover .student-card-avatar {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .student-card-name{
            color:#fff;
            font-weight:800;
            line-height:1.15;
            margin-bottom:.35rem;
            word-break:break-word;
        }

        .student-card-meta{
            font-size:.80rem;
            color:rgba(255,255,255,.62);
            margin-bottom:.75rem;
        }

        .student-card-badges{
            display:flex;
            flex-wrap:wrap;
            justify-content:center;
            gap:.45rem;
            margin-bottom:.9rem;
        }

        .student-card-actions{
            display:grid;
            grid-template-columns:repeat(2, minmax(0,1fr));
            gap:.5rem;
            margin-top:auto;
        }

        .student-card-actions .btn{
            width:100%;
        }

        #modal-global .modal-content,
        #homeworkTabsModal .modal-content{
            border:0;
            border-radius: 12px;
            box-shadow:0 16px 40px rgba(0,0,0,.20);
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
        }

        #modal-global .modal-header,
        #homeworkTabsModal .modal-header{
            background:linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            color:#fff;
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
        }

        .bulk-toolbar{
            border:1px solid rgba(255,255,255,.08);
            background:rgba(255,255,255,.03);
            border-radius:12px;
            padding:.85rem 1rem;
            transition: var(--transition-smooth);
        }

        .bulk-toolbar:hover {
            border-color: rgba(45, 212, 191, 0.15);
            background: rgba(45, 212, 191, 0.05);
        }

        .student-check-wrap{
            position:relative;
            z-index:3;
            display:flex;
            align-items:center;
            justify-content:flex-start;
        }

        @media (max-width: 991.98px){
            .kid-item{
                flex-direction:column;
                align-items:stretch;
                gap:.85rem;
                padding:.9rem;
            }

            .kid-avatar-wrap{
                align-self:flex-start;
            }

            .kid-avatar{
                width:58px;
                height:66px;
            }

            .kid-meta{
                gap:.4rem;
            }

            .kid-soft-badge{
                max-width:100%;
                white-space:normal;
                word-break:break-word;
            }

            .student-actions{
                align-items:stretch;
                min-width:100%;
                width:100%;
                margin-top:.35rem;
            }

            .student-inline-actions{
                justify-content:stretch;
                display:grid;
                grid-template-columns:repeat(2, minmax(0,1fr));
            }

            .student-inline-actions .btn,
            .student-inline-actions a,
            .student-inline-actions button{
                width:100%;
            }

            .action-tile{
                padding:.9rem;
            }
        }

        @media (max-width: 575.98px){
            .card-body{
                padding:.9rem;
            }

            .kid-item,
            .student-simple-card,
            .student-card-view,
            .action-tile,
            .room-stat-box,
            .room-switcher-box,
            .rooms-dark-card,
            .room-hero{
                border-radius:12px;
            }

            .student-inline-actions{
                grid-template-columns:repeat(1, minmax(0,1fr));
            }

            .student-simple-avatar{
                width:84px;
                height:98px;
            }

            .student-card-actions{
                grid-template-columns:repeat(1, minmax(0,1fr));
            }
        }

        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\shop\checkout\index.blade.php :: <style> ===== */
.mini-cart-menu   { width: 400px; min-width: 400px; }
        .mini-cart-items  { max-height: 50vh; overflow:auto; }
        .mini-cart-thumb  { width:48px; height:48px; object-fit:cover; border-radius:8px; }
        .mini-cart-title  { max-width: 200px; }

        .checkout-card    { border-radius: 14px; }
        .paypal-button-tagline{visibility:hidden!important;display:none!important}

        input[readonly][name="relay_name"],
        input[readonly][name="relay_line1"] {
            background-color:#fff; cursor:not-allowed;
        }

        .line-thumb {
            width:60px;
            height:60px;
            object-fit:cover;
            border-radius:8px;
        }

/* ===== resources\views\shop\partials\mini-cart.blade.php :: <style> ===== */
.mini-cart-menu {
        width: 400px;
        min-width: 400px;
    }

    .mini-cart-items {
        max-height: 50vh;
        overflow: auto;
    }

    .mini-cart-thumb {
        width:48px;
        height:48px;
        object-fit:cover;
        border-radius:8px;
    }

    .mini-cart-title {
        max-width: 200px;
    }

/* ===== HUD APPLY ===== */

    .hud-dropdown-wrap {
        position: relative;
    }

    .hud-dropdown-toggle {
        border-radius: 10px;
        transition: all .25s ease;
    }

    .hud-dropdown-toggle:hover {
        transform: translateY(-1px);
        box-shadow: 0 0 12px rgba(109,209,248,.25);
    }

    /* MENU HUD */
    .dropdown-menu.hud-dropdown-menu {
        position: absolute;
        overflow: hidden;
        border: 1px solid rgba(167,238,251,.18);
        border-radius: 10px;

        background:
            radial-gradient(circle at top right, rgba(109,209,248,.12), transparent 30%),
            radial-gradient(circle at bottom left, rgba(167,238,251,.08), transparent 28%),
            linear-gradient(145deg, rgba(10,19,36,.94), rgba(17,24,39,.98));

        color: #e7f8fc;

        box-shadow:
            0 0 0 1px rgba(167,238,251,.08),
            0 0 24px rgba(109,209,248,.12),
            0 22px 46px rgba(0,0,0,.58);

        backdrop-filter: blur(10px);
        padding: .6rem;

        z-index: 1085 !important;
    }

    /* scanline */
    .dropdown-menu.hud-dropdown-menu::before {
        content:"";
        position:absolute;
        inset:0;
        pointer-events:none;
        background: repeating-linear-gradient(
            to bottom,
            rgba(255,255,255,0.025) 0px,
            rgba(255,255,255,0.025) 1px,
            transparent 2px,
            transparent 4px
        );
        opacity:.2;
    }

    /* glow hover */
    .dropdown-menu.hud-dropdown-menu:hover {
        border-color: rgba(45,212,191,0.9) !important;
        box-shadow:
            0 0 0 1px rgba(45,212,191,0.35),
            0 0 18px rgba(45,212,191,0.45),
            0 0 32px rgba(45,212,191,0.22),
            0 18px 35px rgba(0,0,0,0.45) !important;
    }

    /* CORNERS HUD */
    .hud-corner {
        position:absolute;
        width:16px;
        height:16px;
        border-color: rgba(167,238,251,.6);
        pointer-events:none;
        opacity:0;
        transition:.25s;
    }

    .hud-dropdown-wrap:hover .hud-corner {
        opacity:1;
    }

    .hud-corner.tl { top:6px; left:6px; border-top:2px solid; border-left:2px solid; }
    .hud-corner.tr { top:6px; right:6px; border-top:2px solid; border-right:2px solid; }
    .hud-corner.bl { bottom:6px; left:6px; border-bottom:2px solid; border-left:2px solid; }
    .hud-corner.br { bottom:6px; right:6px; border-bottom:2px solid; border-right:2px solid; }

    /* BADGE */
    #cart-count-badge {
        box-shadow: 0 0 10px rgba(239,68,68,.4);
    }

    /* MOBILE */
    @media (max-width:575px) {
        .mini-cart-menu {
            width: 92vw !important;
            min-width: unset !important;
        }
    }

/* ===== resources\views\shop\products\index.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 34%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .shop-page {
            min-height: 100vh;
            padding: 3rem 0 4rem;
        }

        .shop-hero {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            padding: 2rem;
            margin-bottom: 1.5rem;
            background: rgba(7, 16, 28, .88);
            border: 1px solid rgba(45, 212, 191, .22);
            box-shadow: 0 25px 70px rgba(0, 0, 0, .35);
            backdrop-filter: blur(14px);
        }

        .shop-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .16), transparent 42%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
        }

        .shop-hero-content {
            position: relative;
            z-index: 2;
        }

        .shop-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .shop-title {
            color: #f8fafc;
            font-size: clamp(1.65rem, 3vw, 2.35rem);
            font-weight: 700;
            margin: 1rem 0 .35rem;
        }

        .shop-subtitle {
            color: rgba(226, 232, 240, .72);
            margin-bottom: 0;
            max-width: 650px;
        }

        .shop-filter-card {
            position: relative;
            z-index: 2;
            padding: 1rem;
            border-radius: 20px;
            background: rgba(15, 23, 42, .78);
            border: 1px solid rgba(148, 163, 184, .16);
        }

        .shop-filter-card .form-label {
            color: rgba(226, 232, 240, .78);
            font-weight: 700;
        }

        .shop-control {
            min-height: 40px;
            border-radius: 13px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .shop-control::placeholder {
            color: rgba(148, 163, 184, .72);
        }

        .shop-control:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .btn-neon {
            border: 0;
            color: #04111f;
            font-weight: 800;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .product-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            color: #fff;
            background: rgba(7, 16, 28, .86);
            border: 1px solid rgba(148, 163, 184, .16);
            box-shadow: 0 16px 42px rgba(0, 0, 0, .28);
            transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
        }

        .product-card:hover {
            transform: translateY(-4px);
            border-color: rgba(45, 212, 191, .75);
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .22),
                0 0 22px rgba(45, 212, 191, .16),
                0 22px 55px rgba(0, 0, 0, .40);
        }

        .product-img-wrap {
            position: relative;
            aspect-ratio: 4 / 3;
            overflow: hidden;
            background:
                radial-gradient(circle at center, rgba(45, 212, 191, .12), transparent 55%),
                rgba(15, 23, 42, .92);
        }

        .product-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform .35s ease;
        }

        .product-card:hover .product-img {
            transform: scale(1.04);
        }

        .product-img-placeholder {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgba(226, 232, 240, .42);
            font-size: 3rem;
        }

        .stock-badge {
            position: absolute;
            top: .75rem;
            left: .75rem;
            z-index: 3;
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .7rem;
            border-radius: 999px;
            color: #f8fafc;
            background: rgba(15, 23, 42, .80);
            border: 1px solid rgba(255, 255, 255, .12);
            backdrop-filter: blur(10px);
            font-size: .75rem;
            font-weight: 800;
        }

        .stock-dot {
            width: 8px;
            height: 8px;
            border-radius: 999px;
            display: inline-block;
        }

        .product-body {
            padding: 1rem;
        }

        .product-title {
            color: #f8fafc;
            font-weight: 800;
            margin-bottom: .5rem;
        }

        .product-price {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .4rem .75rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 900;
            margin-bottom: 1rem;
        }

        .empty-shop {
            border-radius: 24px;
            padding: 2.5rem 1.5rem;
            text-align: center;
            color: rgba(226, 232, 240, .75);
            background: rgba(7, 16, 28, .82);
            border: 1px dashed rgba(148, 163, 184, .28);
        }

        .shop-pagination {
            position: relative;
            z-index: 10;
            display: flex;
            justify-content: center;
            margin-top: 2rem;
        }

        .shop-pagination nav {
            width: 100%;
        }

        .shop-pagination .pagination {
            position: relative;
            z-index: 10;
            display: flex;
            flex-wrap: wrap;
            gap: .35rem;
            justify-content: center;
            margin-bottom: 0;
        }

        .shop-pagination .page-item {
            position: relative;
            z-index: 10;
        }

        .shop-pagination .page-link {
            position: relative;
            z-index: 10;
            border-radius: 12px !important;
            color: #a7eefb !important;
            background: rgba(15, 23, 42, .90) !important;
            border: 1px solid rgba(167, 238, 251, .20) !important;
            min-width: 38px;
            text-align: center;
        }

        .shop-pagination .page-link:hover {
            color: #04111f !important;
            background: #a7eefb !important;
            border-color: #a7eefb !important;
        }

        .shop-pagination .page-item.active .page-link {
            color: #04111f !important;
            background: #67e8f9 !important;
            border-color: #67e8f9 !important;
        }

        .shop-pagination .page-item.disabled .page-link {
            pointer-events: none;
            color: rgba(148, 163, 184, .45) !important;
            background: rgba(15, 23, 42, .55) !important;
        }

        @supports not (aspect-ratio: 4 / 3) {
            .product-img-wrap {
                height: 220px;
            }
        }

        @media (max-width: 767.98px) {
            .shop-page {
                padding-top: 2rem;
            }

            .shop-hero {
                padding: 1.35rem;
                border-radius: 22px;
            }

            .shop-filter-card {
                margin-top: 1rem;
            }
        }

/* ===== resources\views\shop\products\show.blade.php :: <style> ===== */
.app {
            padding-top: 0 !important;
        }

        body {
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom right, rgba(59, 130, 246, .14), transparent 34%),
                linear-gradient(135deg, #07101c, #0f172a);
            min-height: 100vh;
        }

        .product-page {
            min-height: 100vh;
            padding: 3rem 0 4rem;
        }

        .product-shell {
            position: relative;
            overflow: hidden;
            border-radius: 28px;
            padding: 1.25rem;
            background: rgba(7, 16, 28, .88);
            border: 1px solid rgba(45, 212, 191, .20);
            box-shadow: 0 25px 70px rgba(0, 0, 0, .35);
            backdrop-filter: blur(16px);
        }

        .product-shell::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(120deg, rgba(45, 212, 191, .13), transparent 42%),
                repeating-linear-gradient(
                    to bottom,
                    rgba(255,255,255,.025) 0,
                    rgba(255,255,255,.025) 1px,
                    transparent 1px,
                    transparent 7px
                );
            pointer-events: none;
        }

        .product-content {
            position: relative;
            z-index: 2;
        }

        .product-gallery-card,
        .product-info-card {
            border-radius: 24px;
            background: rgba(15, 23, 42, .72);
            border: 1px solid rgba(148, 163, 184, .16);
            box-shadow: 0 18px 45px rgba(0, 0, 0, .25);
        }

        .product-gallery-card {
            position: sticky;
            top: 1.25rem;
            overflow: hidden;
        }

        .product-main-image-wrap {
            position: relative;
            aspect-ratio: 4 / 3;
            overflow: hidden;
            border-radius: 22px;
            background:
                radial-gradient(circle at center, rgba(45, 212, 191, .12), transparent 55%),
                rgba(15, 23, 42, .92);
        }

        .product-main-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        .product-image-placeholder {
            width: 100%;
            height: 100%;
            min-height: 320px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgba(226, 232, 240, .42);
            font-size: 4rem;
        }

        .availability-badge {
            position: absolute;
            top: 1rem;
            left: 1rem;
            z-index: 3;
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .55rem .8rem;
            border-radius: 999px;
            color: #f8fafc;
            background: rgba(15, 23, 42, .82);
            border: 1px solid rgba(255, 255, 255, .12);
            backdrop-filter: blur(10px);
            font-size: .78rem;
            font-weight: 800;
        }

        .availability-dot {
            width: 10px;
            height: 10px;
            border-radius: 999px;
            display: inline-block;
        }

        .thumbs-wrap {
            display: flex;
            flex-wrap: wrap;
            gap: .6rem;
            padding-top: 1rem;
        }

        .product-thumb {
            width: 76px;
            height: 76px;
            object-fit: cover;
            cursor: pointer;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, .28);
            background: rgba(15, 23, 42, .85);
            padding: .2rem;
            transition: all .2s ease;
        }

        .product-thumb:hover {
            border-color: rgba(45, 212, 191, .8);
            transform: translateY(-2px);
        }

        .shop-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .product-title {
            color: #f8fafc;
            font-size: clamp(1.65rem, 3vw, 2.45rem);
            font-weight: 800;
            margin: 1rem 0 .75rem;
        }

        .product-price {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: .55rem 1rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .20);
            font-size: 1.45rem;
            font-weight: 900;
        }

        .product-sku {
            color: rgba(226, 232, 240, .55);
            margin-top: .55rem;
        }

        .product-form-card {
            margin-top: 1.5rem;
            padding: 1.25rem;
            border-radius: 22px;
            background: rgba(2, 6, 23, .32);
            border: 1px solid rgba(148, 163, 184, .14);
        }

        .product-form-card .form-label {
            color: rgba(226, 232, 240, .86);
            font-weight: 800;
        }

        .shop-control,
        .product-form-card .form-select,
        .product-form-card .form-control {
            min-height: 44px;
            border-radius: 14px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .shop-control:focus,
        .product-form-card .form-select:focus,
        .product-form-card .form-control:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .product-form-card .form-text,
        .product-form-card .text-muted,
        #stockInfo {
            color: rgba(226, 232, 240, .58) !important;
        }

        .btn-neon {
            border: 0;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .product-description {
            margin-top: 1.5rem;
            padding: 1.25rem;
            border-radius: 22px;
            color: rgba(226, 232, 240, .78);
            background: rgba(15, 23, 42, .44);
            border: 1px solid rgba(148, 163, 184, .12);
            line-height: 1.75;
            text-align: justify;
        }

        .product-nav {
            margin-top: 2rem;
            padding: 1rem;
            border-radius: 22px;
            background: rgba(7, 16, 28, .72);
            border: 1px solid rgba(148, 163, 184, .14);
        }

        .product-nav-label {
            display: block;
            color: rgba(226, 232, 240, .55);
            font-size: .75rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .08em;
            margin-bottom: .2rem;
        }

        .text-neon {
            color: #a7eefb;
        }

        @supports not (aspect-ratio: 4 / 3) {
            .product-main-image-wrap {
                height: 360px;
            }
        }

        @media (max-width: 991.98px) {
            .product-gallery-card {
                position: relative;
                top: auto;
            }
        }

        @media (max-width: 575.98px) {
            .product-page {
                padding-top: 2rem;
            }

            .product-shell {
                border-radius: 22px;
                padding: .9rem;
            }

            .product-gallery-card,
            .product-info-card {
                border-radius: 20px;
            }

            .product-info-card {
                padding: 1.25rem !important;
            }

            .product-thumb {
                width: 64px;
                height: 64px;
            }
        }

/* ===== resources\views\students\create.blade.php :: <style> ===== */
:root{
            --hud-bg: #07101c;
            --hud-bg-2: #0b1324;
            --hud-card: rgba(9, 16, 31, .88);
            --hud-card-2: rgba(11, 19, 36, .95);
            --hud-line: rgba(120,232,255,.14);
            --hud-line-strong: rgba(120,232,255,.28);
            --hud-text: #e8f3ff;
            --hud-text-soft: #94aeca;
            --hud-cyan: #78e8ff;
            --hud-cyan-2: #42d9ff;
            --hud-cyan-3: #b8f7ff;
            --hud-yellow: #ffd76a;
            --hud-green: #43f0b5;
            --hud-danger: #ff7f98;
        }

        html,
        body {
            min-height: 100%;
            margin: 0 !important;
            padding: 0 !important;
            overflow-x: hidden;
        }

        .app-content,
        .app-content .container,
        .app-content .container-fluid,
        body .container {
            max-width: 100% !important;
            width: 100% !important;
        }

        .app-content {
            margin-top: 0 !important;
            padding: 0 !important;
        }

        .app,
        .app-header-fixed .app,
        .app-header-fixed .app-content {
            margin-top: 0 !important;
            padding-top: 0 !important;
        }

        .students-create-page {
            width: 100%;
            margin-top: 0 !important;
            padding-top: 0 !important;
        }

        .students-create-page .navbar,
        .students-create-page header,
        .students-create-page .app-header,
        .students-create-page .page-header,
        .students-create-page .main-header {
            margin-top: 0 !important;
            top: 0 !important;
        }

        .students-create-page > *:first-child {
            margin-top: 0 !important;
        }

        .main-title {
            color: var(--hud-text);
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            margin-bottom: 0;
            text-shadow: 0 0 14px rgba(120,232,255,.18);
        }

        .btn-outline-yellow,
        .btn-outline-white,
        .btn-outline-light,
        .btn-danger {
            border-radius: 2px !important;
            font-weight: 700;
            letter-spacing: .02em;
            transition: all .25s ease;
        }

        .btn-outline-yellow {
            color: var(--hud-yellow) !important;
            border: 1px solid rgba(255,215,106,.50) !important;
            background: linear-gradient(180deg, rgba(255,215,106,.08), rgba(255,215,106,.03)) !important;
        }

        .btn-outline-yellow:hover {
            color: #111827 !important;
            background: var(--hud-yellow) !important;
            border-color: var(--hud-yellow) !important;
        }

        .btn-outline-white,
        .btn-outline-light {
            color: var(--hud-text) !important;
            border: 1px solid rgba(120,232,255,.24) !important;
            background: linear-gradient(180deg, rgba(120,232,255,.06), rgba(120,232,255,.02)) !important;
        }

        .btn-outline-white:hover,
        .btn-outline-light:hover {
            color: #08111d !important;
            background: var(--hud-cyan) !important;
            border-color: var(--hud-cyan) !important;
        }

        .card {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.06) !important;
            border-radius: 2px !important;
            background: linear-gradient(180deg, rgba(14,22,39,.96), rgba(10,16,29,.98)) !important;
            box-shadow: 0 10px 30px rgba(0,0,0,.28);
        }

        .hud-top-intro {
            background: linear-gradient(135deg, rgba(10,18,35,.95), rgba(6,11,22,.92)) !important;
        }

        .hud-main-card {
            border-radius: 2px;
            background: linear-gradient(180deg, rgba(12,18,32,.98), rgba(9,14,25,.99)) !important;
            border: 1px solid rgba(255,255,255,.07) !important;
        }

        .card-header {
            border-bottom: 1px solid rgba(255,255,255,.06) !important;
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)) !important;
            color: var(--hud-text) !important;
            padding: 1rem 1.15rem;
        }

        .card-header h5,
        .card-header h6,
        .card-title {
            color: var(--hud-text) !important;
            font-weight: 800;
            letter-spacing: .03em;
            text-transform: uppercase;
            margin-bottom: 0;
        }

        .card-body {
            color: var(--hud-text-soft);
            margin: 0 !important;
            background: transparent !important;
        }

        .hud-body-inner {
            width: 100%;
            position: relative;
            z-index: 2;
        }

        .wizard-progress-wrap {
            margin-bottom: 1.25rem;
        }

        .wizard-progress-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            margin-bottom: .65rem;
        }

        .wizard-progress-title {
            color: var(--hud-text);
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            font-size: .86rem;
        }

        .wizard-progress-meta {
            color: var(--hud-text-soft);
            font-size: .84rem;
            font-weight: 700;
        }

        .wizard-progress {
            height: 10px;
            border-radius: 2px;
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.05);
            overflow: hidden;
        }

        .wizard-progress-bar {
            width: 10%;
            height: 100%;
            background: linear-gradient(90deg, #7ee7ff, #b9f4ff);
            transition: width .35s ease;
        }

        .form-wizard .nav.navstpes {
            gap: .75rem;
            background: rgba(14, 25, 50, 0.55);
            border: 1px solid rgba(120,232,255,.12);
            border-radius: 2px;
            padding: .95rem;
            height: 100%;
        }

        .form-wizard .nav.navstpes .btn {
            width: 100%;
            justify-content: flex-start;
            text-align: left;
            border-radius: 2px !important;
            border: 1px solid rgba(120,232,255,.14) !important;
            color: var(--hud-text-soft) !important;
            background: rgba(255,255,255,.02) !important;
            padding: 1rem !important;
            font-weight: 700;
        }

        .form-wizard .nav.navstpes .btn.active {
            background: linear-gradient(90deg, #78e8ff, #aaf6ff) !important;
            color: #08111d !important;
            border-color: rgba(120,232,255,.75) !important;
        }

        .wizard-step-error {
            border-color: rgba(255,127,152,.85) !important;
            color: #fff !important;
            background: linear-gradient(90deg, rgba(255,127,152,.30), rgba(255,127,152,.10)) !important;
        }

        .wizard-step-complete {
            border-color: rgba(67,240,181,.65) !important;
            box-shadow: 0 0 0 1px rgba(67,240,181,.12) inset !important;
        }

        .sider-link {
            font-size: .95rem;
            font-weight: 800;
        }

        .wizard-summary {
            background: linear-gradient(180deg, rgba(120,232,255,.06), rgba(120,232,255,.02));
            border: 1px solid rgba(120,232,255,.12);
            border-radius: 2px;
            padding: 1rem;
            height: 100%;
        }

        .wizard-summary-title {
            color: var(--hud-text);
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            font-size: .88rem;
            margin-bottom: .9rem;
        }

        .wizard-summary-list {
            display: grid;
            gap: .75rem;
        }

        .wizard-summary-item {
            display: flex;
            justify-content: space-between;
            gap: .75rem;
            padding: .85rem .9rem;
            border-radius: 2px;
            background: rgba(255,255,255,.025);
            border: 1px solid rgba(120,232,255,.08);
        }

        .wizard-summary-label {
            color: var(--hud-text-soft);
            font-size: .82rem;
            text-transform: uppercase;
            font-weight: 700;
        }

        .wizard-summary-value {
            color: var(--hud-text);
            font-weight: 800;
            text-align: right;
        }

        .wizard-summary-value.is-accent {
            color: var(--hud-yellow);
        }

        .wizard-summary-chip {
            display: inline-flex;
            margin-top: .95rem;
            border-radius: 2px;
            padding: .5rem .85rem;
            font-size: .8rem;
            font-weight: 700;
            color: var(--hud-cyan);
            background: rgba(120,232,255,.08);
            border: 1px solid rgba(120,232,255,.14);
        }

        .form-label {
            color: var(--hud-text);
            font-weight: 700;
            font-size: .92rem;
        }

        .form-control,
        .form-select,
        .input-group-text {
            min-height: 48px;
            border-radius: 2px !important;
            border: 1px solid #046a76 !important;
            background: rgba(5,10,20,.65) !important;
            color: #fff !important;
            box-shadow: none !important;
        }

        .form-control::placeholder {
            color: #6f89a6 !important;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(120,232,255,.55) !important;
            box-shadow: 0 0 0 2px rgba(120,232,255,.15) !important;
            background: rgba(10,16,30,.9) !important;
            color: #fff !important;
        }

        .form-text,
        .small,
        .text-muted {
            color: var(--hud-text-soft) !important;
        }

        .form-field-error-wrap {
            position: relative;
        }

        .form-control.is-invalid,
        .form-select.is-invalid,
        .form-check-input.is-invalid {
            border-color: var(--hud-danger) !important;
            animation: invalidPulse 1.2s ease-in-out infinite;
            box-shadow:
                0 0 0 2px rgba(255,127,152,.20),
                0 0 18px rgba(255,127,152,.25) !important;
        }

        .input-group:has(.is-invalid) .input-group-text {
            border-color: var(--hud-danger) !important;
            color: var(--hud-danger) !important;
        }

        .form-check-input.is-invalid {
            background-color: rgba(255,127,152,.15) !important;
        }

        .form-field-error-icon {
            position: absolute;
            right: 14px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--hud-danger);
            pointer-events: none;
            z-index: 5;
        }

        .form-field-error-wrap .form-control.is-invalid,
        .form-field-error-wrap .form-select.is-invalid {
            padding-right: 42px !important;
        }

        .invalid-feedback {
            color: #ff9db2 !important;
            font-weight: 700;
            margin-top: .35rem;
        }

        .invalid-feedback.d-block {
            display: block !important;
        }

        .offcanvas {
            background: linear-gradient(180deg, rgba(8,13,25,.98), rgba(12,18,33,.98)) !important;
            color: var(--hud-text) !important;
        }

        .offcanvas .list-group-item {
            background: transparent !important;
            color: var(--hud-text-soft) !important;
            border-color: rgba(120,232,255,.08) !important;
        }

        .preinsc-steps i {
            color: var(--hud-cyan);
            margin-right: .5rem;
        }

        @keyframes invalidPulse {
            0%, 100% {
                box-shadow:
                    0 0 0 2px rgba(255,127,152,.14),
                    0 0 12px rgba(255,127,152,.18);
            }

            50% {
                box-shadow:
                    0 0 0 3px rgba(255,127,152,.28),
                    0 0 24px rgba(255,127,152,.38);
            }
        }

        @media (max-width: 1399.98px) {
            .wizard-summary {
                margin-top: 1rem;
            }
        }

        @media (max-width: 1199.98px) {
            .form-wizard .nav.navstpes {
                margin-bottom: 1rem;
                height: auto;
            }
        }

        @media (max-width: 767.98px) {
            .main-title {
                font-size: 1.1rem;
            }

            .hud-body-inner {
                padding-left: .95rem !important;
                padding-right: .95rem !important;
            }

            .wizard-progress-head {
                flex-direction: column;
                align-items: flex-start;
            }
        }

/* ===== resources\views\students\create.blade.php :: @push(css) ===== */

        :root{
            --hud-bg: #07101c;
            --hud-bg-2: #0b1324;
            --hud-card: rgba(9, 16, 31, .88);
            --hud-card-2: rgba(11, 19, 36, .95);
            --hud-line: rgba(120,232,255,.14);
            --hud-line-strong: rgba(120,232,255,.28);
            --hud-text: #e8f3ff;
            --hud-text-soft: #94aeca;
            --hud-cyan: #78e8ff;
            --hud-cyan-2: #42d9ff;
            --hud-cyan-3: #b8f7ff;
            --hud-yellow: #ffd76a;
            --hud-green: #43f0b5;
            --hud-danger: #ff7f98;
        }

        html,
        body {
            min-height: 100%;
            margin: 0 !important;
            padding: 0 !important;
            overflow-x: hidden;
        }

        .app-content,
        .app-content .container,
        .app-content .container-fluid,
        body .container {
            max-width: 100% !important;
            width: 100% !important;
        }

        .app-content {
            margin-top: 0 !important;
            padding: 0 !important;
        }

        .app,
        .app-header-fixed .app,
        .app-header-fixed .app-content {
            margin-top: 0 !important;
            padding-top: 0 !important;
        }

        .students-create-page {
            width: 100%;
            margin-top: 0 !important;
            padding-top: 0 !important;
        }

        .students-create-page .navbar,
        .students-create-page header,
        .students-create-page .app-header,
        .students-create-page .page-header,
        .students-create-page .main-header {
            margin-top: 0 !important;
            top: 0 !important;
        }

        .students-create-page > *:first-child {
            margin-top: 0 !important;
        }

        .main-title {
            color: var(--hud-text);
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            margin-bottom: 0;
            text-shadow: 0 0 14px rgba(120,232,255,.18);
        }

        .btn-outline-yellow,
        .btn-outline-white,
        .btn-outline-light,
        .btn-danger {
            border-radius: 2px !important;
            font-weight: 700;
            letter-spacing: .02em;
            transition: all .25s ease;
        }

        .btn-outline-yellow {
            color: var(--hud-yellow) !important;
            border: 1px solid rgba(255,215,106,.50) !important;
            background: linear-gradient(180deg, rgba(255,215,106,.08), rgba(255,215,106,.03)) !important;
        }

        .btn-outline-yellow:hover {
            color: #111827 !important;
            background: var(--hud-yellow) !important;
            border-color: var(--hud-yellow) !important;
        }

        .btn-outline-white,
        .btn-outline-light {
            color: var(--hud-text) !important;
            border: 1px solid rgba(120,232,255,.24) !important;
            background: linear-gradient(180deg, rgba(120,232,255,.06), rgba(120,232,255,.02)) !important;
        }

        .btn-outline-white:hover,
        .btn-outline-light:hover {
            color: #08111d !important;
            background: var(--hud-cyan) !important;
            border-color: var(--hud-cyan) !important;
        }

        .card {
            position: relative;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,.06) !important;
            border-radius: 2px !important;
            background: linear-gradient(180deg, rgba(14,22,39,.96), rgba(10,16,29,.98)) !important;
            box-shadow: 0 10px 30px rgba(0,0,0,.28);
        }

        .hud-top-intro {
            background: linear-gradient(135deg, rgba(10,18,35,.95), rgba(6,11,22,.92)) !important;
        }

        .hud-main-card {
            border-radius: 2px;
            background: linear-gradient(180deg, rgba(12,18,32,.98), rgba(9,14,25,.99)) !important;
            border: 1px solid rgba(255,255,255,.07) !important;
        }

        .card-header {
            border-bottom: 1px solid rgba(255,255,255,.06) !important;
            background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)) !important;
            color: var(--hud-text) !important;
            padding: 1rem 1.15rem;
        }

        .card-header h5,
        .card-header h6,
        .card-title {
            color: var(--hud-text) !important;
            font-weight: 800;
            letter-spacing: .03em;
            text-transform: uppercase;
            margin-bottom: 0;
        }

        .card-body {
            color: var(--hud-text-soft);
            margin: 0 !important;
            background: transparent !important;
        }

        .hud-body-inner {
            width: 100%;
            position: relative;
            z-index: 2;
        }

        .wizard-progress-wrap {
            margin-bottom: 1.25rem;
        }

        .wizard-progress-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            margin-bottom: .65rem;
        }

        .wizard-progress-title {
            color: var(--hud-text);
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
            font-size: .86rem;
        }

        .wizard-progress-meta {
            color: var(--hud-text-soft);
            font-size: .84rem;
            font-weight: 700;
        }

        .wizard-progress {
            height: 10px;
            border-radius: 2px;
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.05);
            overflow: hidden;
        }

        .wizard-progress-bar {
            width: 10%;
            height: 100%;
            background: linear-gradient(90deg, #7ee7ff, #b9f4ff);
            transition: width .35s ease;
        }

        .form-wizard .nav.navstpes {
            gap: .75rem;
            background: rgba(14, 25, 50, 0.55);
            border: 1px solid rgba(120,232,255,.12);
            border-radius: 2px;
            padding: .95rem;
            height: 100%;
        }

        .form-wizard .nav.navstpes .btn {
            width: 100%;
            justify-content: flex-start;
            text-align: left;
            border-radius: 2px !important;
            border: 1px solid rgba(120,232,255,.14) !important;
            color: var(--hud-text-soft) !important;
            background: rgba(255,255,255,.02) !important;
            padding: 1rem !important;
            font-weight: 700;
        }

        .form-wizard .nav.navstpes .btn.active {
            background: linear-gradient(90deg, #78e8ff, #aaf6ff) !important;
            color: #08111d !important;
            border-color: rgba(120,232,255,.75) !important;
        }

        .wizard-step-error {
            border-color: rgba(255,127,152,.85) !important;
            color: #fff !important;
            background: linear-gradient(90deg, rgba(255,127,152,.30), rgba(255,127,152,.10)) !important;
        }

        .wizard-step-complete {
            border-color: rgba(67,240,181,.65) !important;
            box-shadow: 0 0 0 1px rgba(67,240,181,.12) inset !important;
        }

        .sider-link {
            font-size: .95rem;
            font-weight: 800;
        }

        .wizard-summary {
            background: linear-gradient(180deg, rgba(120,232,255,.06), rgba(120,232,255,.02));
            border: 1px solid rgba(120,232,255,.12);
            border-radius: 2px;
            padding: 1rem;
            height: 100%;
        }

        .wizard-summary-title {
            color: var(--hud-text);
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            font-size: .88rem;
            margin-bottom: .9rem;
        }

        .wizard-summary-list {
            display: grid;
            gap: .75rem;
        }

        .wizard-summary-item {
            display: flex;
            justify-content: space-between;
            gap: .75rem;
            padding: .85rem .9rem;
            border-radius: 2px;
            background: rgba(255,255,255,.025);
            border: 1px solid rgba(120,232,255,.08);
        }

        .wizard-summary-label {
            color: var(--hud-text-soft);
            font-size: .82rem;
            text-transform: uppercase;
            font-weight: 700;
        }

        .wizard-summary-value {
            color: var(--hud-text);
            font-weight: 800;
            text-align: right;
        }

        .wizard-summary-value.is-accent {
            color: var(--hud-yellow);
        }

        .wizard-summary-chip {
            display: inline-flex;
            margin-top: .95rem;
            border-radius: 2px;
            padding: .5rem .85rem;
            font-size: .8rem;
            font-weight: 700;
            color: var(--hud-cyan);
            background: rgba(120,232,255,.08);
            border: 1px solid rgba(120,232,255,.14);
        }

        .form-label {
            color: var(--hud-text);
            font-weight: 700;
            font-size: .92rem;
        }

        .form-control,
        .form-select,
        .input-group-text {
            min-height: 48px;
            border-radius: 2px !important;
            border: 1px solid #046a76 !important;
            background: rgba(5,10,20,.65) !important;
            color: #fff !important;
            box-shadow: none !important;
        }

        .form-control::placeholder {
            color: #6f89a6 !important;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(120,232,255,.55) !important;
            box-shadow: 0 0 0 2px rgba(120,232,255,.15) !important;
            background: rgba(10,16,30,.9) !important;
            color: #fff !important;
        }

        .form-text,
        .small,
        .text-muted {
            color: var(--hud-text-soft) !important;
        }

        .form-field-error-wrap {
            position: relative;
        }

        .form-control.is-invalid,
        .form-select.is-invalid,
        .form-check-input.is-invalid {
            border-color: var(--hud-danger) !important;
            animation: invalidPulse 1.2s ease-in-out infinite;
            box-shadow:
                0 0 0 2px rgba(255,127,152,.20),
                0 0 18px rgba(255,127,152,.25) !important;
        }

        .input-group:has(.is-invalid) .input-group-text {
            border-color: var(--hud-danger) !important;
            color: var(--hud-danger) !important;
        }

        .form-check-input.is-invalid {
            background-color: rgba(255,127,152,.15) !important;
        }

        .form-field-error-icon {
            position: absolute;
            right: 14px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--hud-danger);
            pointer-events: none;
            z-index: 5;
        }

        .form-field-error-wrap .form-control.is-invalid,
        .form-field-error-wrap .form-select.is-invalid {
            padding-right: 42px !important;
        }

        .invalid-feedback {
            color: #ff9db2 !important;
            font-weight: 700;
            margin-top: .35rem;
        }

        .invalid-feedback.d-block {
            display: block !important;
        }

        .offcanvas {
            background: linear-gradient(180deg, rgba(8,13,25,.98), rgba(12,18,33,.98)) !important;
            color: var(--hud-text) !important;
        }

        .offcanvas .list-group-item {
            background: transparent !important;
            color: var(--hud-text-soft) !important;
            border-color: rgba(120,232,255,.08) !important;
        }

        .preinsc-steps i {
            color: var(--hud-cyan);
            margin-right: .5rem;
        }

        @keyframes invalidPulse {
            0%, 100% {
                box-shadow:
                    0 0 0 2px rgba(255,127,152,.14),
                    0 0 12px rgba(255,127,152,.18);
            }

            50% {
                box-shadow:
                    0 0 0 3px rgba(255,127,152,.28),
                    0 0 24px rgba(255,127,152,.38);
            }
        }

        @media (max-width: 1399.98px) {
            .wizard-summary {
                margin-top: 1rem;
            }
        }

        @media (max-width: 1199.98px) {
            .form-wizard .nav.navstpes {
                margin-bottom: 1rem;
                height: auto;
            }
        }

        @media (max-width: 767.98px) {
            .main-title {
                font-size: 1.1rem;
            }

            .hud-body-inner {
                padding-left: .95rem !important;
                padding-right: .95rem !important;
            }

            .wizard-progress-head {
                flex-direction: column;
                align-items: flex-start;
            }
        }

/* ===== resources\views\students\edit.blade.php :: <style> ===== */
/* Optionnel: petit spacing uniforme entre les cartes quand on force la hauteur */
        .g-3 > [class*="col-"] > .card:not(:first-child) { margin-top: .5rem; }

/* ===== resources\views\students\edit.blade.php :: @push(css) ===== */

        /* Optionnel: petit spacing uniforme entre les cartes quand on force la hauteur */
        .g-3 > [class*="col-"] > .card:not(:first-child) { margin-top: .5rem; }

/* ===== resources\views\students\families.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .86);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .35);
            --hud-text: #e8f3ff;
            --hud-soft: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
        }

        .preinsc-page {
            position: relative;
        }

        .preinsc-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.25rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 32%),
                linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .32);
        }

        .preinsc-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .75rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .9rem 1rem;
            background: rgba(15, 23, 42, .7);
            height: 100%;
        }

        .stat-label {
            color: var(--hud-soft);
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.35rem;
            font-weight: 800;
            line-height: 1;
        }

        .preinsc-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .preinsc-card:hover {
            border-color: rgba(45, 212, 191, .75) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .28),
                0 0 22px rgba(45, 212, 191, .25),
                0 18px 42px rgba(0, 0, 0, .4) !important;
        }

        .toolbar-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .8rem;
            background: rgba(2, 6, 23, .35);
        }

        .filter-select {
            min-width: 190px;
            border-color: rgba(167, 238, 251, .25);
            background-color: rgba(15, 23, 42, .85);
            color: var(--hud-text);
        }

        .filter-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
        }

        .btn-neon,
        .btn-outline-neon:hover {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-neon:hover,
        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .table-preinsc {
            margin-bottom: 0;
            font-size: 13.5px;
            color: var(--hud-text);
        }

        .table-preinsc thead th {
            position: sticky;
            top: 0;
            z-index: 2;
            border-bottom: 1px solid var(--hud-line-strong);
            background: rgba(2, 6, 23, .96);
            color: var(--hud-blue);
            font-size: .72rem;
            text-transform: uppercase;
            letter-spacing: .05em;
            white-space: nowrap;
        }

        .table-preinsc td,
        .table-preinsc th {
            vertical-align: middle;
            white-space: nowrap;
            border-color: rgba(148, 163, 184, .12);
        }

        .table-preinsc tbody tr {
            transition: background .2s ease, transform .2s ease;
        }

        .table-preinsc tbody tr:hover {
            background: rgba(45, 212, 191, .07);
        }

        .family-avatar {
            width: 34px;
            height: 34px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            font-weight: 900;
            box-shadow: 0 0 18px rgba(45, 212, 191, .25);
        }

        .muted {
            color: var(--hud-soft) !important;
        }

        .badge-soft {
            border: 1px solid rgba(255, 255, 255, .12);
            border-radius: 999px;
            padding: .4rem .6rem;
            font-weight: 700;
        }

        .badge-waiting {
            color: #422006;
            background: rgba(250, 204, 21, .9);
        }

        .badge-accepted {
            color: #052e16;
            background: rgba(52, 211, 153, .95);
        }

        .badge-refused {
            color: #450a0a;
            background: rgba(248, 113, 113, .95);
        }

        .action-group {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .25rem;
            border: 1px solid rgba(148, 163, 184, .14);
            border-radius: 999px;
            background: rgba(2, 6, 23, .32);
        }

        .action-group .btn {
            width: 32px;
            height: 30px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            border-radius: 999px;
        }

        .tooltip-inner {
            max-width: 340px;
            text-align: left;
            white-space: pre-line;
        }

        .empty-state {
            padding: 3rem 1rem;
            text-align: center;
            color: var(--hud-soft);
        }

        .empty-state i {
            font-size: 2.4rem;
            color: var(--hud-blue);
            margin-bottom: .75rem;
        }

        @media (max-width: 768px) {
            .preinsc-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.1rem;
            }

            .table-preinsc {
                font-size: 13px;
            }
        }
        .table-sm>:not(caption)>*>* {
            padding: .825rem !important;
        }

/* ===== resources\views\students\families.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .86);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .35);
            --hud-text: #e8f3ff;
            --hud-soft: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
        }

        .preinsc-page {
            position: relative;
        }

        .preinsc-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 18px;
            padding: 1.25rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 32%),
                linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .96));
            box-shadow: 0 20px 55px rgba(0, 0, 0, .32);
        }

        .preinsc-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .08), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .text-neon {
            color: var(--hud-blue);
            text-shadow: 0 0 14px rgba(167, 238, 251, .25);
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .4rem .75rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .9rem 1rem;
            background: rgba(15, 23, 42, .7);
            height: 100%;
        }

        .stat-label {
            color: var(--hud-soft);
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .stat-value {
            color: var(--hud-text);
            font-size: 1.35rem;
            font-weight: 800;
            line-height: 1;
        }

        .preinsc-card {
            overflow: hidden;
            border: 1px solid var(--hud-line) !important;
            background: var(--hud-card) !important;
            border-radius: 18px;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .preinsc-card:hover {
            border-color: rgba(45, 212, 191, .75) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, .28),
                0 0 22px rgba(45, 212, 191, .25),
                0 18px 42px rgba(0, 0, 0, .4) !important;
        }

        .toolbar-card {
            border: 1px solid var(--hud-line);
            border-radius: 16px;
            padding: .8rem;
            background: rgba(2, 6, 23, .35);
        }

        .filter-select {
            min-width: 190px;
            border-color: rgba(167, 238, 251, .25);
            background-color: rgba(15, 23, 42, .85);
            color: var(--hud-text);
        }

        .filter-select:focus {
            border-color: var(--hud-cyan);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, .16);
        }

        .btn-neon,
        .btn-outline-neon:hover {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 700;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .btn-neon:hover,
        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #0f172a;
        }

        .table-preinsc {
            margin-bottom: 0;
            font-size: 13.5px;
            color: var(--hud-text);
        }

        .table-preinsc thead th {
            position: sticky;
            top: 0;
            z-index: 2;
            border-bottom: 1px solid var(--hud-line-strong);
            background: rgba(2, 6, 23, .96);
            color: var(--hud-blue);
            font-size: .72rem;
            text-transform: uppercase;
            letter-spacing: .05em;
            white-space: nowrap;
        }

        .table-preinsc td,
        .table-preinsc th {
            vertical-align: middle;
            white-space: nowrap;
            border-color: rgba(148, 163, 184, .12);
        }

        .table-preinsc tbody tr {
            transition: background .2s ease, transform .2s ease;
        }

        .table-preinsc tbody tr:hover {
            background: rgba(45, 212, 191, .07);
        }

        .family-avatar {
            width: 34px;
            height: 34px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #0f172a;
            background: linear-gradient(135deg, var(--hud-blue), var(--hud-cyan));
            font-weight: 900;
            box-shadow: 0 0 18px rgba(45, 212, 191, .25);
        }

        .muted {
            color: var(--hud-soft) !important;
        }

        .badge-soft {
            border: 1px solid rgba(255, 255, 255, .12);
            border-radius: 999px;
            padding: .4rem .6rem;
            font-weight: 700;
        }

        .badge-waiting {
            color: #422006;
            background: rgba(250, 204, 21, .9);
        }

        .badge-accepted {
            color: #052e16;
            background: rgba(52, 211, 153, .95);
        }

        .badge-refused {
            color: #450a0a;
            background: rgba(248, 113, 113, .95);
        }

        .action-group {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .25rem;
            border: 1px solid rgba(148, 163, 184, .14);
            border-radius: 999px;
            background: rgba(2, 6, 23, .32);
        }

        .action-group .btn {
            width: 32px;
            height: 30px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            border-radius: 999px;
        }

        .tooltip-inner {
            max-width: 340px;
            text-align: left;
            white-space: pre-line;
        }

        .empty-state {
            padding: 3rem 1rem;
            text-align: center;
            color: var(--hud-soft);
        }

        .empty-state i {
            font-size: 2.4rem;
            color: var(--hud-blue);
            margin-bottom: .75rem;
        }

        @media (max-width: 768px) {
            .preinsc-hero {
                padding: 1rem;
            }

            .stat-value {
                font-size: 1.1rem;
            }

            .table-preinsc {
                font-size: 13px;
            }
        }
        .table-sm>:not(caption)>*>* {
            padding: .825rem !important;
        }

/* ===== resources\views\students\family-edit.blade.php :: <style> ===== */
.family-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 14px;
            background: rgba(255,255,255,.02);
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }

        .section-title {
            font-size: 1rem;
            font-weight: 700;
            margin-bottom: 1rem;
        }

        .form-label {
            font-weight: 600;
        }

        .student-inline {
            border: 1px solid rgba(255,255,255,.07);
            border-radius: 12px;
            background: rgba(255,255,255,.02);
            padding: 12px 14px;
        }

        .mini-label {
            color: #94a3b8;
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .03em;
        }

        .mini-value {
            color: #e5e7eb;
            font-weight: 500;
        }

/* ===== resources\views\students\family-edit.blade.php :: @push(css) ===== */

        .family-card {
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 14px;
            background: rgba(255,255,255,.02);
            box-shadow: 0 10px 30px rgba(0,0,0,.18);
        }

        .section-title {
            font-size: 1rem;
            font-weight: 700;
            margin-bottom: 1rem;
        }

        .form-label {
            font-weight: 600;
        }

        .student-inline {
            border: 1px solid rgba(255,255,255,.07);
            border-radius: 12px;
            background: rgba(255,255,255,.02);
            padding: 12px 14px;
        }

        .mini-label {
            color: #94a3b8;
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .03em;
        }

        .mini-value {
            color: #e5e7eb;
            font-weight: 500;
        }

/* ===== resources\views\students\family-show.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .35);
            --hud-text: #e8f3ff;
            --hud-soft: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
            --hud-purple: #c084fc;
        }

        .preinsc-show-page {
            position: relative;
        }

        .text-neon {
            color: var(--hud-blue) !important;
            text-shadow: 0 0 16px rgba(167, 238, 251, .28);
        }

        .muted {
            color: var(--hud-soft) !important;
        }

        .family-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 22px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .20), transparent 35%),
                radial-gradient(circle at bottom right, rgba(96, 165, 250, .16), transparent 35%),
                linear-gradient(135deg, rgba(15, 23, 42, .98), rgba(2, 6, 23, .98));
            box-shadow: 0 22px 60px rgba(0, 0, 0, .38);
        }

        .family-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .09), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .family-card {
            border: 1px solid var(--hud-line) !important;
            border-radius: 20px;
            background: var(--hud-card) !important;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            overflow: hidden;
        }

        .section-title {
            color: var(--hud-text);
            font-size: 1rem;
            font-weight: 900;
            margin-bottom: .15rem;
        }

        .info-box {
            height: 100%;
            border: 1px solid rgba(167, 238, 251, .11);
            border-radius: 16px;
            padding: .85rem;
            background: rgba(2, 6, 23, .24);
        }

        .info-label {
            font-size: .72rem;
            color: var(--hud-soft);
            text-transform: uppercase;
            letter-spacing: .06em;
            margin-bottom: .25rem;
        }

        .info-value {
            font-size: .95rem;
            font-weight: 700;
            color: var(--hud-text);
            word-break: break-word;
        }

        .badge-soft {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .45rem .7rem;
            font-weight: 900;
            font-size: .78rem;
        }

        .badge-waiting {
            color: #422006;
            background: rgba(250, 204, 21, .95);
        }

        .badge-payment {
            color: #082f49;
            background: rgba(125, 211, 252, .95);
        }

        .badge-admin {
            color: #1e1b4b;
            background: rgba(196, 181, 253, .95);
        }

        .badge-accepted {
            color: #052e16;
            background: rgba(52, 211, 153, .95);
        }

        .badge-refused {
            color: #450a0a;
            background: rgba(248, 113, 113, .95);
        }

        .btn-neon,
        .btn-outline-neon:hover {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .student-card {
            border: 1px solid rgba(167, 238, 251, .14);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .08), transparent 35%),
                rgba(2, 6, 23, .28);
            transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
        }

        .student-card:hover {
            border-color: rgba(45, 212, 191, .55);
            transform: translateY(-2px);
            box-shadow: 0 14px 35px rgba(0, 0, 0, .25);
        }

        .student-avatar {
            width: 62px;
            height: 62px;
            object-fit: cover;
            border-radius: 18px;
            border: 1px solid rgba(167, 238, 251, .22);
            background: rgba(255,255,255,.04);
            box-shadow: 0 0 18px rgba(45, 212, 191, .16);
        }

        .empty-avatar {
            width: 62px;
            height: 62px;
            border-radius: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            color: var(--hud-blue);
            font-size: 1.35rem;
        }

        .age-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .25rem .55rem;
            background: rgba(45, 212, 191, .16);
            border: 1px solid rgba(45, 212, 191, .35);
            color: var(--hud-cyan);
            font-size: .75rem;
            font-weight: 900;
        }

        .student-meta {
            display: flex;
            flex-wrap: wrap;
            gap: .45rem;
            margin-top: .55rem;
        }

        .meta-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .28rem .55rem;
            background: rgba(148, 163, 184, .10);
            border: 1px solid rgba(148, 163, 184, .14);
            color: var(--hud-soft);
            font-size: .76rem;
            font-weight: 700;
        }

        .payment-box {
            border: 1px solid rgba(167, 238, 251, .14);
            border-radius: 18px;
            padding: 1rem;
            background: rgba(2, 6, 23, .28);
        }

        .payment-bar {
            height: 8px;
            border-radius: 999px;
            background: rgba(148, 163, 184, .18);
            overflow: hidden;
        }

        .payment-bar span {
            display: block;
            height: 100%;
            border-radius: 999px;
            background: linear-gradient(90deg, var(--hud-cyan), var(--hud-blue));
        }

        @media (max-width: 768px) {
            .family-hero {
                padding: 1rem;
            }

            .student-card .d-flex {
                align-items: flex-start !important;
            }
        }

/* ===== resources\views\students\family-show.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .88);
            --hud-card-2: rgba(11, 19, 36, .96);
            --hud-line: rgba(120, 232, 255, .16);
            --hud-line-strong: rgba(120, 232, 255, .35);
            --hud-text: #e8f3ff;
            --hud-soft: #94a3b8;
            --hud-cyan: #2dd4bf;
            --hud-blue: #a7eefb;
            --hud-danger: #fb7185;
            --hud-warning: #facc15;
            --hud-success: #34d399;
            --hud-purple: #c084fc;
        }

        .preinsc-show-page {
            position: relative;
        }

        .text-neon {
            color: var(--hud-blue) !important;
            text-shadow: 0 0 16px rgba(167, 238, 251, .28);
        }

        .muted {
            color: var(--hud-soft) !important;
        }

        .family-hero {
            position: relative;
            overflow: hidden;
            border: 1px solid var(--hud-line);
            border-radius: 22px;
            padding: 1.35rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .20), transparent 35%),
                radial-gradient(circle at bottom right, rgba(96, 165, 250, .16), transparent 35%),
                linear-gradient(135deg, rgba(15, 23, 42, .98), rgba(2, 6, 23, .98));
            box-shadow: 0 22px 60px rgba(0, 0, 0, .38);
        }

        .family-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(167, 238, 251, .09), transparent);
            transform: translateX(-100%);
            animation: scanLine 5s infinite;
            pointer-events: none;
        }

        @keyframes scanLine {
            0% { transform: translateX(-100%); }
            45%, 100% { transform: translateX(100%); }
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .85rem;
            border-radius: 999px;
            color: var(--hud-blue);
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .05em;
        }

        .family-card {
            border: 1px solid var(--hud-line) !important;
            border-radius: 20px;
            background: var(--hud-card) !important;
            box-shadow: 0 20px 55px rgba(0, 0, 0, .28);
            overflow: hidden;
        }

        .section-title {
            color: var(--hud-text);
            font-size: 1rem;
            font-weight: 900;
            margin-bottom: .15rem;
        }

        .info-box {
            height: 100%;
            border: 1px solid rgba(167, 238, 251, .11);
            border-radius: 16px;
            padding: .85rem;
            background: rgba(2, 6, 23, .24);
        }

        .info-label {
            font-size: .72rem;
            color: var(--hud-soft);
            text-transform: uppercase;
            letter-spacing: .06em;
            margin-bottom: .25rem;
        }

        .info-value {
            font-size: .95rem;
            font-weight: 700;
            color: var(--hud-text);
            word-break: break-word;
        }

        .badge-soft {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .45rem .7rem;
            font-weight: 900;
            font-size: .78rem;
        }

        .badge-waiting {
            color: #422006;
            background: rgba(250, 204, 21, .95);
        }

        .badge-payment {
            color: #082f49;
            background: rgba(125, 211, 252, .95);
        }

        .badge-admin {
            color: #1e1b4b;
            background: rgba(196, 181, 253, .95);
        }

        .badge-accepted {
            color: #052e16;
            background: rgba(52, 211, 153, .95);
        }

        .badge-refused {
            color: #450a0a;
            background: rgba(248, 113, 113, .95);
        }

        .btn-neon,
        .btn-outline-neon:hover {
            border-color: var(--hud-blue);
            background: var(--hud-blue);
            color: #0f172a;
            font-weight: 800;
        }

        .btn-outline-neon {
            border-color: rgba(167, 238, 251, .55);
            color: var(--hud-blue);
            background: transparent;
        }

        .student-card {
            border: 1px solid rgba(167, 238, 251, .14);
            border-radius: 18px;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .08), transparent 35%),
                rgba(2, 6, 23, .28);
            transition: border-color .25s ease, transform .25s ease, box-shadow .25s ease;
        }

        .student-card:hover {
            border-color: rgba(45, 212, 191, .55);
            transform: translateY(-2px);
            box-shadow: 0 14px 35px rgba(0, 0, 0, .25);
        }

        .student-avatar {
            width: 62px;
            height: 62px;
            object-fit: cover;
            border-radius: 18px;
            border: 1px solid rgba(167, 238, 251, .22);
            background: rgba(255,255,255,.04);
            box-shadow: 0 0 18px rgba(45, 212, 191, .16);
        }

        .empty-avatar {
            width: 62px;
            height: 62px;
            border-radius: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(167, 238, 251, .08);
            border: 1px solid rgba(167, 238, 251, .22);
            color: var(--hud-blue);
            font-size: 1.35rem;
        }

        .age-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .25rem .55rem;
            background: rgba(45, 212, 191, .16);
            border: 1px solid rgba(45, 212, 191, .35);
            color: var(--hud-cyan);
            font-size: .75rem;
            font-weight: 900;
        }

        .student-meta {
            display: flex;
            flex-wrap: wrap;
            gap: .45rem;
            margin-top: .55rem;
        }

        .meta-pill {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            border-radius: 999px;
            padding: .28rem .55rem;
            background: rgba(148, 163, 184, .10);
            border: 1px solid rgba(148, 163, 184, .14);
            color: var(--hud-soft);
            font-size: .76rem;
            font-weight: 700;
        }

        .payment-box {
            border: 1px solid rgba(167, 238, 251, .14);
            border-radius: 18px;
            padding: 1rem;
            background: rgba(2, 6, 23, .28);
        }

        .payment-bar {
            height: 8px;
            border-radius: 999px;
            background: rgba(148, 163, 184, .18);
            overflow: hidden;
        }

        .payment-bar span {
            display: block;
            height: 100%;
            border-radius: 999px;
            background: linear-gradient(90deg, var(--hud-cyan), var(--hud-blue));
        }

        @media (max-width: 768px) {
            .family-hero {
                padding: 1rem;
            }

            .student-card .d-flex {
                align-items: flex-start !important;
            }
        }

/* ===== resources\views\students\index.blade.php :: <style> ===== */
/* Cards */
        .card-preinscription {
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: .75rem;
            box-shadow: 0 8px 24px rgba(0,0,0,0.35);
        }
        .card-preinscription .card-header {
            border-bottom: 1px solid rgba(255,255,255,0.12);
            font-weight: 600;
        }

        /* Table */
        .table-preinscription tbody tr:hover {
            background: rgba(255,255,255,0.03);
        }
        .table-preinscription .avatar {
            width: 52px;
            height: 52px;
            object-fit: cover;
            border-radius: 50%;
        }

        /* Filtres */
        .filters .form-control,
        .filters .form-select {
            min-width: 200px;
        }
        .filters .form-label {
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .03em;
            opacity: .8;
        }
        @media (max-width: 992px) {
            .filters {
                gap: .5rem !important;
            }
        }

        /* Pagination Laravel */
        .pagination {
            justify-content: flex-end;
        }

        /* Assure que les modales passent au-dessus du HUD */
        .modal {
            z-index: 2000;
        }
        .modal-backdrop.show {
            z-index: 1990;
        }

/* ===== resources\views\students\index.blade.php :: @push(css) ===== */

        /* Cards */
        .card-preinscription {
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: .75rem;
            box-shadow: 0 8px 24px rgba(0,0,0,0.35);
        }
        .card-preinscription .card-header {
            border-bottom: 1px solid rgba(255,255,255,0.12);
            font-weight: 600;
        }

        /* Table */
        .table-preinscription tbody tr:hover {
            background: rgba(255,255,255,0.03);
        }
        .table-preinscription .avatar {
            width: 52px;
            height: 52px;
            object-fit: cover;
            border-radius: 50%;
        }

        /* Filtres */
        .filters .form-control,
        .filters .form-select {
            min-width: 200px;
        }
        .filters .form-label {
            font-size: .75rem;
            text-transform: uppercase;
            letter-spacing: .03em;
            opacity: .8;
        }
        @media (max-width: 992px) {
            .filters {
                gap: .5rem !important;
            }
        }

        /* Pagination Laravel */
        .pagination {
            justify-content: flex-end;
        }

        /* Assure que les modales passent au-dessus du HUD */
        .modal {
            z-index: 2000;
        }
        .modal-backdrop.show {
            z-index: 1990;
        }

/* ===== resources\views\teacher_applications\create.blade.php :: <style> ===== */
.day-block{border:1px solid #e9ecef;border-radius:.5rem;padding:1rem;margin-bottom:.75rem}
        .section-title{font-weight:600;margin-top:1.25rem}

/* ===== resources\views\teacher_applications\create.blade.php :: @push(css) ===== */

        .day-block{border:1px solid #e9ecef;border-radius:.5rem;padding:1rem;margin-bottom:.75rem}
        .section-title{font-weight:600;margin-top:1.25rem}

/* ===== resources\views\teachers\allowances.blade.php :: <style> ===== */
:root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
        }

        .allowances-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .allowance-subtitle {
            color: var(--hud-muted);
        }

        .teacher-card {
            display: flex;
            align-items: center;
            gap: 1rem;
        }

        .teacher-avatar {
            width: 104px;
            height: 112px;
            border-radius: 22px;
            object-fit: cover;
            border: 2px solid rgba(45, 212, 191, .35);
            box-shadow: 0 0 0 6px rgba(45, 212, 191, .08);
            background: rgba(255,255,255,.06);
            flex-shrink: 0;
        }

        .teacher-initial {
            width: 82px;
            height: 82px;
            border-radius: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(45, 212, 191, .14);
            border: 1px solid rgba(45, 212, 191, .28);
            color: var(--hud-cyan);
            font-weight: 900;
            font-size: 2rem;
            flex-shrink: 0;
        }

        .teacher-name {
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .teacher-role {
            color: var(--hud-muted);
            font-size: .88rem;
        }

        .teacher-contact a {
            color: var(--hud-cyan);
            text-decoration: none;
            font-weight: 700;
        }

        .teacher-contact a:hover {
            text-decoration: underline;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-label {
            color: rgba(255,255,255,.70);
            font-weight: 700;
            font-size: .82rem;
        }

        .stat-box {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            height: 100%;
        }

        .stat-label {
            color: rgba(255,255,255,.58);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-value {
            color: #fff;
            font-size: 1.55rem;
            font-weight: 900;
            line-height: 1.2;
            margin-top: .35rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .amount-strong {
            font-weight: 900;
            color: #86efac;
            white-space: nowrap;
        }

        .status-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
        }

        .status-paid {
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.28);
            color: #bbf7d0;
        }

        .status-pending {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.28);
            color: #fde68a;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .notes-cell {
            max-width: 280px;
            white-space: normal;
            color: rgba(255,255,255,.78);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .teacher-card {
                align-items: flex-start;
            }
        }

        @media (max-width: 575.98px) {
            .teacher-card {
                flex-direction: column;
            }

            .teacher-avatar,
            .teacher-initial {
                width: 86px;
                height: 86px;
                border-radius: 22px;
            }

            .stat-value {
                font-size: 1.2rem;
            }

            .filter-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .filter-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\teachers\allowances.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: rgba(15, 23, 42, .94);
            --hud-bg-2: rgba(30, 41, 59, .82);
            --hud-border: rgba(255, 255, 255, .10);
            --hud-muted: rgba(255, 255, 255, .64);
            --hud-neon: #2dd4bf;
            --hud-cyan: #a7eefb;
            --hud-gold: #facc15;
        }

        .allowances-page {
            width: 100%;
            overflow-x: hidden;
        }

        .hud-card {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            border: 1px solid var(--hud-border);
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, .14), transparent 34%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, .12), transparent 35%),
                linear-gradient(135deg, var(--hud-bg), var(--hud-bg-2));
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 18px 45px rgba(0,0,0,.22);
        }

        .hud-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent, rgba(255,255,255,.035), transparent);
            pointer-events: none;
        }

        .hud-card > * {
            position: relative;
            z-index: 2;
        }

        .allowance-hero {
            padding: 1.35rem;
            margin-bottom: 1rem;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .45rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            background: rgba(45, 212, 191, .12);
            color: #8ff5e8;
            border: 1px solid rgba(45, 212, 191, .26);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .allowance-title {
            color: #fff;
            font-weight: 900;
            letter-spacing: -.03em;
        }

        .allowance-subtitle {
            color: var(--hud-muted);
        }

        .teacher-card {
            display: flex;
            align-items: center;
            gap: 1rem;
        }

        .teacher-avatar {
            width: 104px;
            height: 112px;
            border-radius: 22px;
            object-fit: cover;
            border: 2px solid rgba(45, 212, 191, .35);
            box-shadow: 0 0 0 6px rgba(45, 212, 191, .08);
            background: rgba(255,255,255,.06);
            flex-shrink: 0;
        }

        .teacher-initial {
            width: 82px;
            height: 82px;
            border-radius: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(45, 212, 191, .14);
            border: 1px solid rgba(45, 212, 191, .28);
            color: var(--hud-cyan);
            font-weight: 900;
            font-size: 2rem;
            flex-shrink: 0;
        }

        .teacher-name {
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .teacher-role {
            color: var(--hud-muted);
            font-size: .88rem;
        }

        .teacher-contact a {
            color: var(--hud-cyan);
            text-decoration: none;
            font-weight: 700;
        }

        .teacher-contact a:hover {
            text-decoration: underline;
        }

        .btn-neon {
            border-color: var(--hud-cyan);
            background: var(--hud-cyan);
            color: #172033;
            font-weight: 800;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            background: #6dd1f8;
            color: #172033;
        }

        .btn-outline-neon {
            border-color: rgba(167,238,251,.65);
            color: var(--hud-cyan);
        }

        .btn-outline-neon:hover {
            background: var(--hud-cyan);
            color: #172033;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.06);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.65);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .form-label {
            color: rgba(255,255,255,.70);
            font-weight: 700;
            font-size: .82rem;
        }

        .stat-box {
            border-radius: 20px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            height: 100%;
        }

        .stat-label {
            color: rgba(255,255,255,.58);
            font-size: .78rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
        }

        .stat-value {
            color: #fff;
            font-size: 1.55rem;
            font-weight: 900;
            line-height: 1.2;
            margin-top: .35rem;
        }

        .section-title {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: #fff;
            font-weight: 900;
            margin-bottom: .25rem;
        }

        .section-title i {
            color: var(--hud-cyan);
        }

        .hud-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,.08);
            background: rgba(255,255,255,.035);
        }

        .hud-table {
            min-width: 860px;
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(255,255,255,.08);
            margin-bottom: 0;
        }

        .hud-table thead th {
            color: #f8fafc;
            font-size: .80rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .04em;
            background: rgba(255,255,255,.055);
            white-space: nowrap;
            vertical-align: middle;
        }

        .hud-table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
        }

        .hud-table tbody tr:hover {
            background: rgba(45,212,191,.06);
        }

        .amount-strong {
            font-weight: 900;
            color: #86efac;
            white-space: nowrap;
        }

        .status-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .42rem .7rem;
            border-radius: 999px;
            font-size: .78rem;
            font-weight: 800;
            border: 1px solid rgba(255,255,255,.10);
        }

        .status-paid {
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.28);
            color: #bbf7d0;
        }

        .status-pending {
            background: rgba(250,204,21,.12);
            border-color: rgba(250,204,21,.28);
            color: #fde68a;
        }

        .empty-state {
            border: 1px dashed rgba(255,255,255,.18);
            border-radius: 20px;
            padding: 2rem;
            text-align: center;
            color: var(--hud-muted);
            background: rgba(255,255,255,.035);
        }

        .notes-cell {
            max-width: 280px;
            white-space: normal;
            color: rgba(255,255,255,.78);
        }

        .card-arrow {
            pointer-events: none;
        }

        @media (max-width: 991.98px) {
            .allowance-hero {
                padding: 1rem;
            }

            .teacher-card {
                align-items: flex-start;
            }
        }

        @media (max-width: 575.98px) {
            .teacher-card {
                flex-direction: column;
            }

            .teacher-avatar,
            .teacher-initial {
                width: 86px;
                height: 86px;
                border-radius: 22px;
            }

            .stat-value {
                font-size: 1.2rem;
            }

            .filter-actions {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: .5rem;
            }

            .filter-actions .btn {
                width: 100%;
            }
        }

/* ===== resources\views\teachers\create.blade.php :: <style> ===== */
.navstpes .btn.active { border-color: var(--bs-warning); }
        .app-form .invalid-feedback { display:block; }

/* ===== resources\views\teachers\create.blade.php :: @push(css) ===== */

        .navstpes .btn.active { border-color: var(--bs-warning); }
        .app-form .invalid-feedback { display:block; }

/* ===== resources\views\teachers\index.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        .teachers-page {
            animation: fadeIn .6s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .teachers-hero {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .teachers-hero::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .teachers-hero .card-body {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: .5px;
            backdrop-filter: blur(10px);
        }

        .teachers-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .teachers-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .teachers-stat-box {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            padding: 1.25rem;
            height: 100%;
            position: relative;
            overflow: hidden;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeInUp .6s ease-out;
        }

        .teachers-stat-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.1), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events: none;
        }

        .teachers-stat-box:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .teachers-stat-box > * {
            position: relative;
            z-index: 2;
        }

        .teachers-stat-box .label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .teachers-stat-box .value {
            margin-top: .5rem;
            font-size: 1.35rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn .6s ease-out;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header,
        .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
        }

        .card-header {
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .hud-card-text {
            color: rgba(255,255,255,.75);
            line-height: 1.6;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: .4px;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: .65rem 1.5rem;
        }

        .btn-sm {
            padding: .45rem .65rem;
            border-radius: 8px;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .btn-outline-neon,
        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-neon:hover,
        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-secondary {
            border-color: rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .btn-outline-secondary:hover {
            background: rgba(148, 163, 184, 0.12);
            border-color: rgba(148, 163, 184, 0.55);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-primary {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .btn-outline-primary:hover {
            background: rgba(59,130,246,.15);
            border-color: rgba(59,130,246,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .btn-outline-success:hover {
            background: rgba(34,197,94,.15);
            border-color: rgba(34,197,94,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .btn-outline-warning:hover {
            background: rgba(250,204,21,.15);
            border-color: rgba(250,204,21,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .btn-outline-danger:hover {
            background: rgba(239,68,68,.15);
            border-color: rgba(239,68,68,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: .5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary,
        .badge.bg-primary-subtle {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa !important;
        }

        .badge.bg-info-subtle {
            background: linear-gradient(135deg, rgba(13, 202, 240, 0.24), rgba(96, 165, 250, 0.16)) !important;
            border: 1px solid rgba(13, 202, 240, 0.35);
            color: #67e8f9 !important;
        }

        .badge.bg-light-subtle {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24 !important;
        }

        .badge.text-bg-danger,
        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171 !important;
        }

        .badge.text-bg-success,
        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80 !important;
        }

        .avatar-sm {
            width: 40px;
            height: 40px;
            object-fit: cover;
            border-radius: 50%;
        }

        .teacher-avatar {
            width: 60px;
            height: 60px;
            object-fit: cover;
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.22);
            background: rgba(255,255,255,.04);
            padding: 2px;
        }

        .form-control,
        .form-select {
            color: rgba(255,255,255,.9);
            background-color: rgba(15,23,42,.72);
            border-color: rgba(45, 212, 191, 0.18);
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            color: #fff;
            background-color: rgba(15,23,42,.9);
            border-color: rgba(45, 212, 191, 0.55);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.12);
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.35);
        }

        .form-label,
        .form-text {
            color: rgba(255,255,255,.72);
        }

        .input-group-text {
            background: rgba(15,23,42,.72);
            border-color: rgba(45, 212, 191, 0.18);
            color: rgba(255,255,255,.75);
        }

        .table-responsive {
            border-radius: 1px;
        }

        .table {
            color: rgba(255,255,255,.78);
            vertical-align: middle;
            margin-bottom: 0;
        }

        .table td,
        .table th {
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.1);
        }

        .table thead th {
            color: rgba(255,255,255,.86);
            background: rgba(15,23,42,.72) !important;
            border-color: rgba(45, 212, 191, 0.16);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .08em;
            font-weight: 800;
        }

        .table-hover > tbody > tr {
            transition: background-color .25s ease, box-shadow .25s ease;
        }

        .table-hover > tbody > tr:hover > * {
            color: #fff;
            background-color: rgba(45, 212, 191, 0.08);
        }

        .teacher-name-block {
            min-width: 180px;
        }

        .teacher-phone {
            color: rgba(255,255,255,.52);
        }

        .teacher-email-link {
            color: #a7eefb;
        }

        .teacher-email-link:hover {
            color: #2dd4bf;
        }

        .actions-cell {
            white-space: nowrap;
        }

        .alert-success {
            color: #bbf7d0;
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.35);
        }

        .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 1px;
            background: var(--dark-gradient);
            color: #fff;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0,0,0,.45);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(45, 212, 191, 0.12);
        }

        .modal-title {
            font-weight: 800;
            color: #fff;
        }

        .btn-close {
            filter: invert(1) grayscale(100%);
            opacity: .75;
        }

        .pagination {
            margin-bottom: 0;
        }

        .page-link {
            color: #2dd4bf;
            background: rgba(15,23,42,.7);
            border-color: rgba(45, 212, 191, 0.18);
        }

        .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.12);
            border-color: rgba(45, 212, 191, 0.45);
        }

        .page-item.active .page-link {
            color: #0f172a;
            background: #2dd4bf;
            border-color: #2dd4bf;
        }

        .page-item.disabled .page-link {
            color: rgba(255,255,255,.35);
            background: rgba(15,23,42,.45);
            border-color: rgba(45, 212, 191, 0.08);
        }

        @media (max-width: 1200px) {
            .teachers-hero-title {
                font-size: 1.75rem;
            }

            .teachers-stat-box .value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 767.98px) {
            .teachers-hero-title {
                font-size: 1.5rem;
            }

            .teachers-stat-box {
                padding: 1.25rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .teachers-search-form {
                width: 100%;
            }

            .teachers-search-form .form-control {
                min-width: 0;
            }

            .actions-cell {
                min-width: 220px;
            }
        }

        @media (max-width: 575.98px) {
            .teachers-hero-title {
                font-size: 1.25rem;
            }

            .teachers-stat-box .value {
                font-size: 1.1rem;
            }

            .hud-title {
                font-size: .85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: .5rem 1rem;
                font-size: .85rem;
            }
        }

/* ===== resources\views\teachers\index.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        .teachers-page {
            animation: fadeIn .6s ease-out;
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }

            to {
                opacity: 1;
            }
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .teachers-hero {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow:
                0 0 20px rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .teachers-hero::before {
            content: "";
            position: absolute;
            inset: 0;

            pointer-events: none;
        }

        .teachers-hero .card-body {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: .5px;
            backdrop-filter: blur(10px);
        }

        .teachers-hero-title {
            color: #fff;
            font-weight: 800;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .teachers-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .teachers-stat-box {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 12px;
            background: var(--dark-gradient);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.1),
                0 10px 40px rgba(0,0,0,.2);
            padding: 1.25rem;
            height: 100%;
            position: relative;
            overflow: hidden;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeInUp .6s ease-out;
        }

        .teachers-stat-box::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at top right, rgba(45, 212, 191, 0.1), transparent 40%),
                radial-gradient(circle at bottom left, rgba(167, 139, 250, 0.05), transparent 40%);
            pointer-events: none;
        }

        .teachers-stat-box:hover {
            border-color: rgba(45, 212, 191, 0.5);
            box-shadow:
                inset 0 1px 0 rgba(45, 212, 191, 0.2),
                0 0 30px rgba(45, 212, 191, 0.3),
                0 20px 50px rgba(0,0,0,.3);
            transform: translateY(-4px);
        }

        .teachers-stat-box > * {
            position: relative;
            z-index: 2;
        }

        .teachers-stat-box .label {
            font-size: .8rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
        }

        .teachers-stat-box .value {
            margin-top: .5rem;
            font-size: 1.35rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn .6s ease-out;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header,
        .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
        }

        .card-header {
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .hud-card-text {
            color: rgba(255,255,255,.75);
            line-height: 1.6;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .bg-neon {
            background-color: rgba(45, 212, 191, 0.15) !important;
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: .4px;
            transition: all .3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: .65rem 1.5rem;
        }

        .btn-sm {
            padding: .45rem .65rem;
            border-radius: 8px;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .btn-outline-neon,
        .btn-outline-light {
            border-color: rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
        }

        .btn-outline-neon:hover,
        .btn-outline-light:hover {
            background: rgba(45, 212, 191, 0.1);
            border-color: rgba(45, 212, 191, 0.6);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-secondary {
            border-color: rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .btn-outline-secondary:hover {
            background: rgba(148, 163, 184, 0.12);
            border-color: rgba(148, 163, 184, 0.55);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-primary {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .btn-outline-primary:hover {
            background: rgba(59,130,246,.15);
            border-color: rgba(59,130,246,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .btn-outline-success:hover {
            background: rgba(34,197,94,.15);
            border-color: rgba(34,197,94,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .btn-outline-warning:hover {
            background: rgba(250,204,21,.15);
            border-color: rgba(250,204,21,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .btn-outline-danger {
            border-color: rgba(239,68,68,.4);
            color: #f87171;
        }

        .btn-outline-danger:hover {
            background: rgba(239,68,68,.15);
            border-color: rgba(239,68,68,.7);
            color: #fff;
            transform: translateY(-2px);
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: .5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary,
        .badge.bg-primary-subtle {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa !important;
        }

        .badge.bg-info-subtle {
            background: linear-gradient(135deg, rgba(13, 202, 240, 0.24), rgba(96, 165, 250, 0.16)) !important;
            border: 1px solid rgba(13, 202, 240, 0.35);
            color: #67e8f9 !important;
        }

        .badge.bg-light-subtle {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24 !important;
        }

        .badge.text-bg-danger,
        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171 !important;
        }

        .badge.text-bg-success,
        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80 !important;
        }

        .avatar-sm {
            width: 40px;
            height: 40px;
            object-fit: cover;
            border-radius: 50%;
        }

        .teacher-avatar {
            width: 60px;
            height: 60px;
            object-fit: cover;
            border-radius: 12px;
            border: 1px solid rgba(45, 212, 191, 0.22);
            background: rgba(255,255,255,.04);
            padding: 2px;
        }

        .form-control,
        .form-select {
            color: rgba(255,255,255,.9);
            background-color: rgba(15,23,42,.72);
            border-color: rgba(45, 212, 191, 0.18);
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            color: #fff;
            background-color: rgba(15,23,42,.9);
            border-color: rgba(45, 212, 191, 0.55);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.12);
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.35);
        }

        .form-label,
        .form-text {
            color: rgba(255,255,255,.72);
        }

        .input-group-text {
            background: rgba(15,23,42,.72);
            border-color: rgba(45, 212, 191, 0.18);
            color: rgba(255,255,255,.75);
        }

        .table-responsive {
            border-radius: 1px;
        }

        .table {
            color: rgba(255,255,255,.78);
            vertical-align: middle;
            margin-bottom: 0;
        }

        .table td,
        .table th {
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.1);
        }

        .table thead th {
            color: rgba(255,255,255,.86);
            background: rgba(15,23,42,.72) !important;
            border-color: rgba(45, 212, 191, 0.16);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .08em;
            font-weight: 800;
        }

        .table-hover > tbody > tr {
            transition: background-color .25s ease, box-shadow .25s ease;
        }

        .table-hover > tbody > tr:hover > * {
            color: #fff;
            background-color: rgba(45, 212, 191, 0.08);
        }

        .teacher-name-block {
            min-width: 180px;
        }

        .teacher-phone {
            color: rgba(255,255,255,.52);
        }

        .teacher-email-link {
            color: #a7eefb;
        }

        .teacher-email-link:hover {
            color: #2dd4bf;
        }

        .actions-cell {
            white-space: nowrap;
        }

        .alert-success {
            color: #bbf7d0;
            background: rgba(34,197,94,.12);
            border-color: rgba(34,197,94,.35);
        }

        .modal-content {
            border: 1px solid rgba(45, 212, 191, 0.2);
            border-radius: 1px;
            background: var(--dark-gradient);
            color: #fff;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0,0,0,.45);
        }

        .modal-header,
        .modal-footer {
            border-color: rgba(45, 212, 191, 0.12);
        }

        .modal-title {
            font-weight: 800;
            color: #fff;
        }

        .btn-close {
            filter: invert(1) grayscale(100%);
            opacity: .75;
        }

        .pagination {
            margin-bottom: 0;
        }

        .page-link {
            color: #2dd4bf;
            background: rgba(15,23,42,.7);
            border-color: rgba(45, 212, 191, 0.18);
        }

        .page-link:hover {
            color: #fff;
            background: rgba(45, 212, 191, 0.12);
            border-color: rgba(45, 212, 191, 0.45);
        }

        .page-item.active .page-link {
            color: #0f172a;
            background: #2dd4bf;
            border-color: #2dd4bf;
        }

        .page-item.disabled .page-link {
            color: rgba(255,255,255,.35);
            background: rgba(15,23,42,.45);
            border-color: rgba(45, 212, 191, 0.08);
        }

        @media (max-width: 1200px) {
            .teachers-hero-title {
                font-size: 1.75rem;
            }

            .teachers-stat-box .value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 767.98px) {
            .teachers-hero-title {
                font-size: 1.5rem;
            }

            .teachers-stat-box {
                padding: 1.25rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .teachers-search-form {
                width: 100%;
            }

            .teachers-search-form .form-control {
                min-width: 0;
            }

            .actions-cell {
                min-width: 220px;
            }
        }

        @media (max-width: 575.98px) {
            .teachers-hero-title {
                font-size: 1.25rem;
            }

            .teachers-stat-box .value {
                font-size: 1.1rem;
            }

            .hud-title {
                font-size: .85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: .5rem 1rem;
                font-size: .85rem;
            }
        }

/* ===== resources\views\teachers\show.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .btn-outline-neon {
            border-color: var(--neon-cyan);
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
        }

        .btn-outline-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            background-color: var(--neon-cyan);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: var(--neon-cyan);
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            color: #303c61;
            font-weight: 600;
            transition: var(--transition-smooth);
        }

        .btn-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            box-shadow: 0 0 25px rgba(45, 212, 191, 0.5);
            transform: translateY(-2px);
        }

        .text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 600;
        }

        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .teacher-hero{
            background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 1px;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
            transition: var(--transition-smooth);
        }

        .teacher-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .teacher-hero > * {
            position: relative;
            z-index: 2;
        }

        .teacher-hero:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .teacher-avatar{
            width: 84px; height: 84px; border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.18);
            background: rgba(255,255,255,.06);
            transition: var(--transition-smooth);
            box-shadow: 0 8px 18px rgba(0,0,0,.22);
        }

        .teacher-hero:hover .teacher-avatar {
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .kv dt { color: rgba(255,255,255,.65); font-weight: 500; }
        .kv dd { margin-bottom: .35rem; }

        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .badge-soft:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .text-dim { color: rgba(255,255,255,.65); }
        .table thead th { white-space: nowrap; }

        .teacher-switch {
            min-width: 260px;
        }

        .form-select {
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            color: #fff;
            transition: var(--transition-smooth);
        }

        .form-select:hover,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
            background: rgba(255,255,255,.08);
        }

        .btn {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .btn-outline-light:hover {
            border-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .btn-outline-primary:hover {
            border-color: rgba(45, 212, 191, 0.5);
            background: rgba(45, 212, 191, 0.15);
            transform: translateY(-2px);
        }

        .btn-outline-danger:hover {
            border-color: #fecaca;
            background: rgba(239, 68, 68, 0.1);
            transform: translateY(-2px);
        }

        /* =========================
           NAV TABS & NAVIGATION
        ========================= */
        .nav-tabs {
            border-bottom: 2px solid rgba(255,255,255,.08);
            gap: 0.5rem;
        }

        .nav-link {
            color: rgba(255,255,255,.65);
            border: 0;
            border-bottom: 3px solid transparent;
            border-radius: 12px 12px 0 0;
            padding: 0.75rem 1rem;
            font-weight: 600;
            transition: var(--transition-smooth);
            font-size: 0.9rem;
            position: relative;
        }

        .nav-link:hover {
            color: rgba(45, 212, 191, 0.9);
            border-bottom-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.05);
        }

        .nav-link.active {
            color: #2dd4bf;
            border-bottom-color: #2dd4bf;
            background: rgba(45, 212, 191, 0.1);
            box-shadow: 0 -4px 12px rgba(45, 212, 191, 0.15);
        }

        /* =========================
           TABLES STYLING
        ========================= */
        .table {
            border-radius: 12px;
            overflow: hidden;
        }

        .table thead th {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.1);
            color: rgba(45, 212, 191, 0.9);
            font-weight: 700;
            letter-spacing: 0.5px;
            text-transform: uppercase;
            font-size: 0.8rem;
            padding: 1rem;
        }

        .table-light {
            background: transparent;
        }

        .table tbody tr {
            border-color: rgba(255,255,255,.05);
            transition: var(--transition-smooth);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, 0.05);
            border-color: rgba(45, 212, 191, 0.15);
            box-shadow: inset 0 0 20px rgba(45, 212, 191, 0.05);
        }

        .table td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            padding: 1rem;
        }

        .table-responsive {
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid rgba(148,163,184,.20);
        }

        /* =========================
           ALERTS STYLING
        ========================= */
        .alert {
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,.12);
            backdrop-filter: blur(4px);
            transition: var(--transition-smooth);
            animation: slideInDown 0.5s ease-out;
        }

        .alert-success {
            background: rgba(34, 197, 94, 0.1);
            border-color: rgba(34, 197, 94, 0.3);
            color: #bbf7d0;
        }

        .alert-danger {
            background: rgba(239, 68, 68, 0.1);
            border-color: rgba(239, 68, 68, 0.3);
            color: #fecaca;
        }

        .alert-warning {
            background: rgba(250, 204, 21, 0.1);
            border-color: rgba(250, 204, 21, 0.3);
            color: #fde68a;
        }

        .alert-info {
            background: rgba(59, 130, 246, 0.1);
            border-color: rgba(59, 130, 246, 0.3);
            color: #bfdbfe;
        }

        .alert:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
        }

        /* =========================
           FORM ELEMENTS
        ========================= */
        .form-label {
            color: rgba(255,255,255,.88);
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            margin-bottom: 0.75rem;
        }

        .form-control,
        textarea.form-control {
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.12);
            border-radius: 12px;
            color: #fff;
            transition: var(--transition-smooth);
            padding: 0.75rem 1rem;
        }

        .form-control:hover,
        textarea.form-control:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
        }

        .form-control:focus,
        textarea.form-control:focus {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.15);
            color: #fff;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.45);
        }

        /* =========================
           MODALS
        ========================= */
        .modal-content {
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 12px;
            box-shadow: 0 20px 60px rgba(0,0,0,.3);
        }

        .modal-header {
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 12px 12px 0 0;
        }

        .modal-title {
            color: #fff;
            font-weight: 700;
            font-size: 1.1rem;
        }

        .modal-footer {
            background: rgba(15,23,42,.88);
            border-top: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 0 0 12px 12px;
        }

        /* =========================
           BADGES IN TABLES
        ========================= */
        .badge {
            border-radius: 12px;
            padding: 0.45rem 0.75rem;
            font-weight: 700;
            font-size: 0.75rem;
            letter-spacing: 0.5px;
            transition: var(--transition-smooth);
            display: inline-block;
        }

        .badge:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,.2);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.9), rgba(34, 197, 94, 0.7)) !important;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.9), rgba(239, 68, 68, 0.7)) !important;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.9), rgba(250, 204, 21, 0.7)) !important;
        }

        .badge.bg-info {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.9), rgba(59, 130, 246, 0.7)) !important;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(107, 114, 128, 0.9), rgba(107, 114, 128, 0.7)) !important;
        }

        /* =========================
           RESPONSIVE ADJUSTMENTS
        ========================= */
        @media (max-width: 991.98px) {
            .nav-link {
                padding: 0.6rem 0.8rem;
                font-size: 0.85rem;
            }

            .table td {
                padding: 0.75rem;
            }

            .table thead th {
                padding: 0.75rem;
            }
        }

        @media (max-width: 575.98px){
            .teacher-hero,
            .card,
            .table-responsive,
            .modal-content {
                border-radius: 12px;
            }

            .nav-tabs {
                flex-wrap: wrap;
                gap: 0.25rem;
            }

            .nav-link {
                padding: 0.5rem 0.6rem;
                font-size: 0.75rem;
            }

            .table {
                font-size: 0.85rem;
            }

            .table td {
                padding: 0.5rem;
            }

            .table thead th {
                padding: 0.5rem;
            }
        }

/* ===== resources\views\teachers\show.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
            --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
        }

        @keyframes slideInDown {
            from {
                opacity: 0;
                transform: translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .card {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow:
                0 0 30px rgba(45, 212, 191, 0.2),
                0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .btn-outline-neon {
            border-color: var(--neon-cyan);
            color: var(--neon-cyan);
            transition: var(--transition-smooth);
        }

        .btn-outline-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            background-color: var(--neon-cyan);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-neon {
            border-color: var(--neon-cyan);
            background: linear-gradient(135deg, var(--neon-cyan), #14b8a6);
            color: #303c61;
            font-weight: 600;
            transition: var(--transition-smooth);
        }

        .btn-neon:hover {
            border-color: var(--neon-cyan);
            color: #fff;
            box-shadow: 0 0 25px rgba(45, 212, 191, 0.5);
            transform: translateY(-2px);
        }

        .text-neon {
            background: linear-gradient(135deg, var(--neon-cyan), var(--neon-purple));
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 600;
        }

        .row-eq > [class^="col-"], .row-eq > [class*=" col-"] { display:flex; }
        .row-eq .card { flex: 1 1 auto; }

        .teacher-hero{
            background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.72));
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 1px;
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 10px 30px rgba(0,0,0,.16);
            position: relative;
            overflow: hidden;
            transition: var(--transition-smooth);
        }

        .teacher-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at top right, rgba(250,204,21,.08), transparent 32%);
            pointer-events: none;
        }

        .teacher-hero > * {
            position: relative;
            z-index: 2;
        }

        .teacher-hero:hover {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow:
                inset 0 1px 0 rgba(255,255,255,.04),
                0 15px 40px rgba(45, 212, 191, 0.15),
                0 0 20px rgba(45, 212, 191, 0.1);
        }

        .teacher-avatar{
            width: 84px; height: 84px; border-radius: 50%;
            object-fit: cover;
            border: 2px solid rgba(255,255,255,.18);
            background: rgba(255,255,255,.06);
            transition: var(--transition-smooth);
            box-shadow: 0 8px 18px rgba(0,0,0,.22);
        }

        .teacher-hero:hover .teacher-avatar {
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 12px 25px rgba(45, 212, 191, 0.15);
        }

        .kv dt { color: rgba(255,255,255,.65); font-weight: 500; }
        .kv dd { margin-bottom: .35rem; }

        .badge-soft{
            background: rgba(255,255,255,.08);
            border: 1px solid rgba(255,255,255,.10);
            color: rgba(255,255,255,.92);
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .badge-soft:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.08);
        }

        .text-dim { color: rgba(255,255,255,.65); }
        .table thead th { white-space: nowrap; }

        .teacher-switch {
            min-width: 260px;
        }

        .form-select {
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,.12);
            background: rgba(255,255,255,.05);
            color: #fff;
            transition: var(--transition-smooth);
        }

        .form-select:hover,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.3);
            box-shadow: 0 0 15px rgba(45, 212, 191, 0.1);
            background: rgba(255,255,255,.08);
        }

        .btn {
            transition: var(--transition-smooth);
            border-radius: 12px;
        }

        .btn-outline-light:hover {
            border-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            transform: translateY(-2px);
        }

        .btn-outline-primary:hover {
            border-color: rgba(45, 212, 191, 0.5);
            background: rgba(45, 212, 191, 0.15);
            transform: translateY(-2px);
        }

        .btn-outline-danger:hover {
            border-color: #fecaca;
            background: rgba(239, 68, 68, 0.1);
            transform: translateY(-2px);
        }

        /* =========================
           NAV TABS & NAVIGATION
        ========================= */
        .nav-tabs {
            border-bottom: 2px solid rgba(255,255,255,.08);
            gap: 0.5rem;
        }

        .nav-link {
            color: rgba(255,255,255,.65);
            border: 0;
            border-bottom: 3px solid transparent;
            border-radius: 12px 12px 0 0;
            padding: 0.75rem 1rem;
            font-weight: 600;
            transition: var(--transition-smooth);
            font-size: 0.9rem;
            position: relative;
        }

        .nav-link:hover {
            color: rgba(45, 212, 191, 0.9);
            border-bottom-color: rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.05);
        }

        .nav-link.active {
            color: #2dd4bf;
            border-bottom-color: #2dd4bf;
            background: rgba(45, 212, 191, 0.1);
            box-shadow: 0 -4px 12px rgba(45, 212, 191, 0.15);
        }

        /* =========================
           TABLES STYLING
        ========================= */
        .table {
            border-radius: 12px;
            overflow: hidden;
        }

        .table thead th {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.1);
            color: rgba(45, 212, 191, 0.9);
            font-weight: 700;
            letter-spacing: 0.5px;
            text-transform: uppercase;
            font-size: 0.8rem;
            padding: 1rem;
        }

        .table-light {
            background: transparent;
        }

        .table tbody tr {
            border-color: rgba(255,255,255,.05);
            transition: var(--transition-smooth);
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, 0.05);
            border-color: rgba(45, 212, 191, 0.15);
            box-shadow: inset 0 0 20px rgba(45, 212, 191, 0.05);
        }

        .table td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            padding: 1rem;
        }

        .table-responsive {
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid rgba(148,163,184,.20);
        }

        /* =========================
           ALERTS STYLING
        ========================= */
        .alert {
            border-radius: 12px;
            border: 1px solid rgba(255,255,255,.12);
            backdrop-filter: blur(4px);
            transition: var(--transition-smooth);
            animation: slideInDown 0.5s ease-out;
        }

        .alert-success {
            background: rgba(34, 197, 94, 0.1);
            border-color: rgba(34, 197, 94, 0.3);
            color: #bbf7d0;
        }

        .alert-danger {
            background: rgba(239, 68, 68, 0.1);
            border-color: rgba(239, 68, 68, 0.3);
            color: #fecaca;
        }

        .alert-warning {
            background: rgba(250, 204, 21, 0.1);
            border-color: rgba(250, 204, 21, 0.3);
            color: #fde68a;
        }

        .alert-info {
            background: rgba(59, 130, 246, 0.1);
            border-color: rgba(59, 130, 246, 0.3);
            color: #bfdbfe;
        }

        .alert:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
        }

        /* =========================
           FORM ELEMENTS
        ========================= */
        .form-label {
            color: rgba(255,255,255,.88);
            font-weight: 600;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            margin-bottom: 0.75rem;
        }

        .form-control,
        textarea.form-control {
            background: rgba(255,255,255,.05);
            border: 1px solid rgba(255,255,255,.12);
            border-radius: 12px;
            color: #fff;
            transition: var(--transition-smooth);
            padding: 0.75rem 1rem;
        }

        .form-control:hover,
        textarea.form-control:hover {
            border-color: rgba(45, 212, 191, 0.2);
            background: rgba(45, 212, 191, 0.05);
        }

        .form-control:focus,
        textarea.form-control:focus {
            background: rgba(45, 212, 191, 0.08);
            border-color: rgba(45, 212, 191, 0.4);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.15);
            color: #fff;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.45);
        }

        /* =========================
           MODALS
        ========================= */
        .modal-content {
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border: 1px solid rgba(148,163,184,.20);
            border-radius: 12px;
            box-shadow: 0 20px 60px rgba(0,0,0,.3);
        }

        .modal-header {
            background: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.92));
            border-bottom: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 12px 12px 0 0;
        }

        .modal-title {
            color: #fff;
            font-weight: 700;
            font-size: 1.1rem;
        }

        .modal-footer {
            background: rgba(15,23,42,.88);
            border-top: 1px solid rgba(45, 212, 191, 0.1);
            border-radius: 0 0 12px 12px;
        }

        /* =========================
           BADGES IN TABLES
        ========================= */
        .badge {
            border-radius: 12px;
            padding: 0.45rem 0.75rem;
            font-weight: 700;
            font-size: 0.75rem;
            letter-spacing: 0.5px;
            transition: var(--transition-smooth);
            display: inline-block;
        }

        .badge:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,.2);
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.9), rgba(34, 197, 94, 0.7)) !important;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.9), rgba(239, 68, 68, 0.7)) !important;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.9), rgba(250, 204, 21, 0.7)) !important;
        }

        .badge.bg-info {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.9), rgba(59, 130, 246, 0.7)) !important;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(107, 114, 128, 0.9), rgba(107, 114, 128, 0.7)) !important;
        }

        /* =========================
           RESPONSIVE ADJUSTMENTS
        ========================= */
        @media (max-width: 991.98px) {
            .nav-link {
                padding: 0.6rem 0.8rem;
                font-size: 0.85rem;
            }

            .table td {
                padding: 0.75rem;
            }

            .table thead th {
                padding: 0.75rem;
            }
        }

        @media (max-width: 575.98px){
            .teacher-hero,
            .card,
            .table-responsive,
            .modal-content {
                border-radius: 12px;
            }

            .nav-tabs {
                flex-wrap: wrap;
                gap: 0.25rem;
            }

            .nav-link {
                padding: 0.5rem 0.6rem;
                font-size: 0.75rem;
            }

            .table {
                font-size: 0.85rem;
            }

            .table td {
                padding: 0.5rem;
            }

            .table thead th {
                padding: 0.5rem;
            }
        }

/* ===== resources\views\users\call_list.blade.php :: <style> ===== */
input {border:none !important}

/* ===== resources\views\users\edit.blade.php :: <style> ===== */
.modal-backdrop {
            background: transparent !important;
            pointer-events: none !important;
        }

/* ===== resources\views\users\edit.blade.php :: <style> ===== */
#calendar {
                                                        min-height: 500px; /* Donne une vraie hauteur */
                                                    }

/* ===== resources\views\users\edition.blade.php :: <style> ===== */
:root {
            --m-neon: #2dd4bf;
            --m-purple: #a78bfa;
            --m-dark: rgba(15,23,42,.94);
            --m-glass: rgba(255,255,255,.055);
            --m-border: rgba(255,255,255,.10);
        }

        .profile-modern-hero {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            padding: 1.4rem;
            margin-bottom: 1rem;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.25), transparent 35%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.18), transparent 35%),
                linear-gradient(135deg, rgba(15,23,42,.98), rgba(30,41,59,.88));
            border: 1px solid var(--m-border);
            box-shadow: 0 18px 50px rgba(0,0,0,.22);
        }

        .profile-modern-card {
            border-radius: 22px;
            background: linear-gradient(135deg, rgba(15,23,42,.92), rgba(30,41,59,.78));
            border: 1px solid var(--m-border);
            box-shadow: 0 16px 45px rgba(0,0,0,.20);
            overflow: hidden;
        }

        .profile-avatar-modern {
            width: 132px;
            height: 132px;
            object-fit: cover;
            border-radius: 28px;
            border: 3px solid rgba(45,212,191,.45);
            box-shadow: 0 0 0 6px rgba(45,212,191,.08), 0 15px 35px rgba(0,0,0,.35);
            background: rgba(255,255,255,.06);
        }

        .profile-role-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(45,212,191,.12);
            color: #8ff5e8;
            border: 1px solid rgba(45,212,191,.25);
            font-size: .78rem;
            font-weight: 700;
        }

        .profile-info-line {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: rgba(255,255,255,.68);
            font-size: .9rem;
            margin-bottom: .45rem;
            word-break: break-word;
        }

        .profile-info-line i {
            color: var(--m-neon);
            width: 18px;
            text-align: center;
        }

        .profile-tab.nav-tabs {
            border: 0;
            gap: .45rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .profile-tab .nav-link {
            border: 1px solid rgba(255,255,255,.10) !important;
            background: rgba(255,255,255,.045);
            color: rgba(255,255,255,.72);
            border-radius: 999px !important;
            padding: .65rem 1rem;
            transition: all .2s ease;
        }

        .profile-tab .nav-link:hover {
            color: #fff;
            border-color: rgba(45,212,191,.35) !important;
            background: rgba(45,212,191,.08);
        }

        .profile-tab .nav-link.active {
            color: #031f1d !important;
            background: linear-gradient(135deg, #2dd4bf, #a7f3d0) !important;
            border-color: transparent !important;
            box-shadow: 0 8px 22px rgba(45,212,191,.20);
        }

        .modern-section-title {
            display: flex;
            align-items: center;
            gap: .65rem;
            font-weight: 800;
            margin-bottom: 1rem;
        }

        .modern-section-title i {
            color: var(--m-neon);
        }

        .modern-panel {
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 18px;
            padding: 1rem;
            margin-bottom: 1rem;
        }

        .form-label,
        .form-group strong {
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .04em;
            color: rgba(255,255,255,.68);
            margin-bottom: .45rem;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.055);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.7);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .doc-status-box {
            border-radius: 18px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            height: 100%;
        }

        .doc-status-box.is-ok {
            border-color: rgba(25,135,84,.35);
            background: rgba(25,135,84,.08);
        }

        .doc-status-box.is-missing {
            border-color: rgba(220,53,69,.35);
            background: rgba(220,53,69,.08);
        }

        .table {
            --bs-table-bg: transparent;
        }

        .card-arrow {
            pointer-events: none;
        }

        .modal-backdrop {
            background: rgba(0,0,0,.55) !important;
            pointer-events: auto !important;
        }

        .avatar-mini {
            width: 54px;
            height: 60px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(255,255,255,.15);
        }

        @media (max-width: 767.98px) {
            .profile-modern-hero {
                padding: 1rem;
            }

            .profile-avatar-modern {
                width: 96px;
                height: 96px;
                border-radius: 22px;
            }

            .profile-tab .nav-link {
                width: 100%;
                text-align: center;
            }
        }

/* ===== resources\views\users\edition.blade.php :: @push(css) ===== */

        :root {
            --m-neon: #2dd4bf;
            --m-purple: #a78bfa;
            --m-dark: rgba(15,23,42,.94);
            --m-glass: rgba(255,255,255,.055);
            --m-border: rgba(255,255,255,.10);
        }

        .profile-modern-hero {
            position: relative;
            overflow: hidden;
            border-radius: 22px;
            padding: 1.4rem;
            margin-bottom: 1rem;
            background:
                radial-gradient(circle at top left, rgba(45,212,191,.25), transparent 35%),
                radial-gradient(circle at bottom right, rgba(167,139,250,.18), transparent 35%),
                linear-gradient(135deg, rgba(15,23,42,.98), rgba(30,41,59,.88));
            border: 1px solid var(--m-border);
            box-shadow: 0 18px 50px rgba(0,0,0,.22);
        }

        .profile-modern-card {
            border-radius: 22px;
            background: linear-gradient(135deg, rgba(15,23,42,.92), rgba(30,41,59,.78));
            border: 1px solid var(--m-border);
            box-shadow: 0 16px 45px rgba(0,0,0,.20);
            overflow: hidden;
        }

        .profile-avatar-modern {
            width: 132px;
            height: 132px;
            object-fit: cover;
            border-radius: 28px;
            border: 3px solid rgba(45,212,191,.45);
            box-shadow: 0 0 0 6px rgba(45,212,191,.08), 0 15px 35px rgba(0,0,0,.35);
            background: rgba(255,255,255,.06);
        }

        .profile-role-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 999px;
            background: rgba(45,212,191,.12);
            color: #8ff5e8;
            border: 1px solid rgba(45,212,191,.25);
            font-size: .78rem;
            font-weight: 700;
        }

        .profile-info-line {
            display: flex;
            align-items: center;
            gap: .55rem;
            color: rgba(255,255,255,.68);
            font-size: .9rem;
            margin-bottom: .45rem;
            word-break: break-word;
        }

        .profile-info-line i {
            color: var(--m-neon);
            width: 18px;
            text-align: center;
        }

        .profile-tab.nav-tabs {
            border: 0;
            gap: .45rem;
            flex-wrap: wrap;
            margin-bottom: 1rem;
        }

        .profile-tab .nav-link {
            border: 1px solid rgba(255,255,255,.10) !important;
            background: rgba(255,255,255,.045);
            color: rgba(255,255,255,.72);
            border-radius: 999px !important;
            padding: .65rem 1rem;
            transition: all .2s ease;
        }

        .profile-tab .nav-link:hover {
            color: #fff;
            border-color: rgba(45,212,191,.35) !important;
            background: rgba(45,212,191,.08);
        }

        .profile-tab .nav-link.active {
            color: #031f1d !important;
            background: linear-gradient(135deg, #2dd4bf, #a7f3d0) !important;
            border-color: transparent !important;
            box-shadow: 0 8px 22px rgba(45,212,191,.20);
        }

        .modern-section-title {
            display: flex;
            align-items: center;
            gap: .65rem;
            font-weight: 800;
            margin-bottom: 1rem;
        }

        .modern-section-title i {
            color: var(--m-neon);
        }

        .modern-panel {
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            border-radius: 18px;
            padding: 1rem;
            margin-bottom: 1rem;
        }

        .form-label,
        .form-group strong {
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .04em;
            color: rgba(255,255,255,.68);
            margin-bottom: .45rem;
        }

        .form-control,
        .form-select {
            border-radius: 14px;
            border-color: rgba(255,255,255,.12);
            background-color: rgba(255,255,255,.055);
            color: #fff;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45,212,191,.7);
            box-shadow: 0 0 0 .2rem rgba(45,212,191,.12);
        }

        .doc-status-box {
            border-radius: 18px;
            padding: 1rem;
            background: rgba(255,255,255,.045);
            border: 1px solid rgba(255,255,255,.08);
            height: 100%;
        }

        .doc-status-box.is-ok {
            border-color: rgba(25,135,84,.35);
            background: rgba(25,135,84,.08);
        }

        .doc-status-box.is-missing {
            border-color: rgba(220,53,69,.35);
            background: rgba(220,53,69,.08);
        }

        .table {
            --bs-table-bg: transparent;
        }

        .card-arrow {
            pointer-events: none;
        }

        .modal-backdrop {
            background: rgba(0,0,0,.55) !important;
            pointer-events: auto !important;
        }

        .avatar-mini {
            width: 54px;
            height: 60px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(255,255,255,.15);
        }

        @media (max-width: 767.98px) {
            .profile-modern-hero {
                padding: 1rem;
            }

            .profile-avatar-modern {
                width: 96px;
                height: 96px;
                border-radius: 22px;
            }

            .profile-tab .nav-link {
                width: 100%;
                text-align: center;
            }
        }

/* ===== resources\views\users\identifiers.blade.php :: <style> ===== */

/* ===== NEON HOVER SUR LES CARDS ===== */
        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 18px rgba(45, 212, 191, 0.45),
                0 0 32px rgba(45, 212, 191, 0.22),
                0 18px 35px rgba(0, 0, 0, 0.45) !important;
        }
        .text-neon {
            color: #a7eefb;
        }

/* ===== resources\views\users\index.blade.php :: <style> ===== */
:root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: #a7eefb;
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        .member-actions-modal {
            z-index: 1075 !important;
        }

        body.modal-open {
            overflow: hidden;
        }

        .modal-dialog,
        .modal-content {
            pointer-events: auto;
        }

        .modal-content {
            border: 1px solid rgba(45,212,191,.22);
            background: var(--dark-gradient);
            color: #fff;
            box-shadow: 0 25px 70px rgba(0,0,0,.55), 0 0 35px rgba(45,212,191,.18);
        }

        .modal-header {
            border-bottom: 1px solid rgba(45,212,191,.14);
        }

        .action-list .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45,212,191,.12);
        }

        .action-list .list-group-item:hover,
        .action-list .list-group-item:focus {
            background: rgba(45,212,191,.10);
            color: #fff;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.1), 0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > *,
        .card > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 600;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .card,
        .stats-card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card:hover,
        .stats-card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header,
        .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-card .card-body {
            min-height: 120px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: left;
        }

        .stats-card .text-neon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            flex: 0 0 42px;
            border-radius: 12px;
            background: rgba(45, 212, 191, 0.12);
            border: 1px solid rgba(45, 212, 191, 0.25);
            margin-bottom: .9rem;
        }

        .stats-card .stats-label {
            margin: 0;
            font-size: .75rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
            line-height: 1.25;
        }

        .stats-card .stats-value {
            margin: 0;
            white-space: nowrap;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-sm {
            padding: .45rem .7rem;
            font-size: .85rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table-hover > tbody > tr:hover > * {
            --bs-table-accent-bg: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .member-avatar {
            width: 46px;
            height: 56px;
            object-fit: cover;
            border-radius: 6px;
            border-color: rgba(45, 212, 191, 0.25);
            background: rgba(15, 23, 42, 0.8);
        }

        .users-pagination {
            position: relative;
            z-index: 10;
        }

        .users-pagination .pagination {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: .35rem;
            margin-bottom: 0;
        }

        .users-pagination .page-link {
            border-radius: 12px !important;
            color: #a7eefb !important;
            background: rgba(15, 23, 42, .90) !important;
            border: 1px solid rgba(167, 238, 251, .20) !important;
        }

        .users-pagination .page-link:hover {
            color: #04111f !important;
            background: #a7eefb !important;
            border-color: #a7eefb !important;
        }

        .users-pagination .page-item.active .page-link {
            color: #04111f !important;
            background: #67e8f9 !important;
            border-color: #67e8f9 !important;
        }

        .users-pagination .page-item.disabled .page-link {
            color: rgba(148, 163, 184, .45) !important;
            background: rgba(15, 23, 42, .55) !important;
        }

        @media (max-width: 991.98px) {
            .users-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .users-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\users\index.blade.php :: @push(css) ===== */

        :root {
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --secondary-gradient: #a7eefb;
            --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
            --neon-cyan: #2dd4bf;
            --neon-purple: #a78bfa;
        }

        @keyframes slideInDown {
            from { opacity: 0; transform: translateY(-20px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        .modal {
            z-index: 1065 !important;
        }

        .modal-backdrop {
            z-index: 1060 !important;
        }

        .member-actions-modal {
            z-index: 1075 !important;
        }

        body.modal-open {
            overflow: hidden;
        }

        .modal-dialog,
        .modal-content {
            pointer-events: auto;
        }

        .modal-content {
            border: 1px solid rgba(45,212,191,.22);
            background: var(--dark-gradient);
            color: #fff;
            box-shadow: 0 25px 70px rgba(0,0,0,.55), 0 0 35px rgba(45,212,191,.18);
        }

        .modal-header {
            border-bottom: 1px solid rgba(45,212,191,.14);
        }

        .action-list .list-group-item {
            background: transparent;
            color: rgba(255,255,255,.88);
            border-color: rgba(45,212,191,.12);
        }

        .action-list .list-group-item:hover,
        .action-list .list-group-item:focus {
            background: rgba(45,212,191,.10);
            color: #fff;
        }

        .dashboard-hero,
        .hero-info {
            position: relative;
            overflow: hidden;
            border-radius: 1px;
            border: 1px solid rgba(45, 212, 191, 0.2);
            background: var(--dark-gradient);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.1), 0 10px 40px rgba(0,0,0,.2);
            animation: slideInDown 0.6s ease-out;
        }

        .dashboard-hero::before,
        .hero-info::before,
        .card::before {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .dashboard-hero > *,
        .hero-info > *,
        .card > * {
            position: relative;
            z-index: 2;
        }

        .hero-chip {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .6rem 1rem;
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(45, 212, 191, 0.15), rgba(167, 139, 250, 0.15));
            border: 1px solid rgba(45, 212, 191, 0.3);
            color: #2dd4bf;
            font-size: .85rem;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .dashboard-hero-title {
            color: #fff;
            font-weight: 600;
            margin-bottom: .5rem;
            font-size: 2rem;
            background: var(--secondary-gradient);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .dashboard-hero-subtitle {
            color: rgba(255,255,255,.75);
            margin-bottom: 0;
            font-size: 1rem;
        }

        .card,
        .stats-card {
            border-color: rgba(45, 212, 191, 0.15) !important;
            border-radius: 1px !important;
            background: var(--dark-gradient) !important;
            box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            animation: fadeIn 0.6s ease-out;
            position: relative;
            overflow: hidden;
        }

        .card:hover,
        .stats-card:hover {
            border-color: rgba(45, 212, 191, 0.5) !important;
            box-shadow: 0 0 30px rgba(45, 212, 191, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
            transform: translateY(-4px);
        }

        .card-body {
            padding: 1.5rem !important;
        }

        .card-header,
        .card-footer {
            background: transparent !important;
            border-color: rgba(45, 212, 191, 0.1) !important;
            padding: 1.25rem !important;
        }

        .hud-title {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .6px;
            font-size: .95rem;
        }

        .stats-card .card-body {
            min-height: 120px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: left;
        }

        .stats-card .text-neon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            flex: 0 0 42px;
            border-radius: 12px;
            background: rgba(45, 212, 191, 0.12);
            border: 1px solid rgba(45, 212, 191, 0.25);
            margin-bottom: .9rem;
        }

        .stats-card .stats-label {
            margin: 0;
            font-size: .75rem;
            text-transform: uppercase;
            color: rgba(255,255,255,.65);
            font-weight: 700;
            letter-spacing: .08em;
            line-height: 1.25;
        }

        .stats-card .stats-value {
            margin: 0;
            white-space: nowrap;
            font-size: 1.5rem;
            font-weight: 800;
            color: #fff;
            line-height: 1.2;
        }

        .text-neon {
            color: #2dd4bf !important;
        }

        .btn {
            border-radius: 8px;
            font-weight: 600;
            letter-spacing: 0.4px;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 0.65rem 1.5rem;
        }

        .btn-sm {
            padding: .45rem .7rem;
            font-size: .85rem;
        }

        .btn-neon {
            border-color: #a7eefb;
            background-color: #a7eefb;
            color: #303c61;
        }

        .btn-neon:hover {
            border-color: #6dd1f8;
            color: #fcfcff;
            background-color: rgba(45, 212, 191, 0.1);
            box-shadow: 0 0 20px rgba(45, 212, 191, 0.4);
            transform: translateY(-2px);
        }

        .btn-outline-neon {
            border-color: #a7eefb;
            color: #a7eefb;
        }

        .btn-outline-neon:hover {
            border-color: #6dd1f8;
            color: #303c61;
            background-color: #a7eefb;
        }

        .badge {
            border-radius: 8px;
            font-weight: 700;
            letter-spacing: 0.5px;
            backdrop-filter: blur(10px);
        }

        .badge.bg-primary {
            background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.2)) !important;
            border: 1px solid rgba(59, 130, 246, 0.4);
            color: #60a5fa;
        }

        .badge.bg-success {
            background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
            border: 1px solid rgba(34, 197, 94, 0.4);
            color: #4ade80;
        }

        .badge.bg-warning {
            background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(251, 191, 36, 0.2)) !important;
            border: 1px solid rgba(250, 204, 21, 0.4);
            color: #fbbf24;
        }

        .badge.bg-danger {
            background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
            border: 1px solid rgba(239, 68, 68, 0.4);
            color: #f87171;
        }

        .badge.bg-secondary {
            background: linear-gradient(135deg, rgba(148, 163, 184, 0.25), rgba(203, 213, 225, 0.15)) !important;
            border: 1px solid rgba(148, 163, 184, 0.35);
            color: #cbd5e1;
        }

        .soft-badge {
            display: inline-flex;
            align-items: center;
            gap: .35rem;
            padding: .45rem .75rem;
            border-radius: 8px;
            font-size: .8rem;
            line-height: 1;
            border: 1px solid rgba(45, 212, 191, 0.3);
            background: rgba(45, 212, 191, 0.1);
            color: #2dd4bf;
            backdrop-filter: blur(10px);
        }

        .soft-badge.badge-info {
            border-color: rgba(59,130,246,.4);
            color: #60a5fa;
        }

        .soft-badge.badge-success {
            border-color: rgba(34,197,94,.4);
            color: #4ade80;
        }

        .soft-badge.badge-warning {
            border-color: rgba(250,204,21,.4);
            color: #fbbf24;
        }

        .table-hud-wrap .table {
            --bs-table-bg: transparent;
            --bs-table-color: #fff;
            --bs-table-border-color: rgba(45, 212, 191, 0.12);
            margin-bottom: 0;
        }

        .table-hud-wrap .table thead th {
            color: #f8fafc;
            font-size: .84rem;
            font-weight: 700;
            border-bottom-width: 1px;
            background: rgba(45, 212, 191, 0.08);
            vertical-align: middle;
            white-space: nowrap;
        }

        .table-hud-wrap .table tbody td {
            color: rgba(255,255,255,.92);
            vertical-align: middle;
            border-color: rgba(45, 212, 191, 0.08);
        }

        .table-hud-wrap .table-striped > tbody > tr:nth-of-type(odd) > * {
            --bs-table-accent-bg: rgba(255,255,255,.025);
            color: rgba(255,255,255,.92);
        }

        .table-hud-wrap .table-hover > tbody > tr:hover > * {
            --bs-table-accent-bg: rgba(45, 212, 191, 0.08);
            color: #fff;
        }

        .table-hud-wrap .table a {
            color: #2dd4bf;
        }

        .table-hud-wrap .table a:hover {
            color: #a78bfa;
        }

        .hud-table-scroll {
            overflow-x: auto;
        }

        .text-muted,
        .form-text {
            color: rgba(255,255,255,.58) !important;
        }

        .form-label {
            color: rgba(255,255,255,.82);
        }

        .form-control,
        .form-select,
        select {
            border-color: rgba(45, 212, 191, 0.2);
            background-color: rgba(15, 23, 42, 0.55) !important;
            color: #e5e7eb;
            border-radius: 8px;
        }

        .form-control:focus,
        .form-select:focus {
            border-color: rgba(45, 212, 191, 0.65);
            box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15);
            color: #fff;
            background-color: rgba(15, 23, 42, 0.75) !important;
        }

        .form-control::placeholder {
            color: rgba(255,255,255,.4);
        }

        .member-avatar {
            width: 46px;
            height: 56px;
            object-fit: cover;
            border-radius: 6px;
            border-color: rgba(45, 212, 191, 0.25);
            background: rgba(15, 23, 42, 0.8);
        }

        .users-pagination {
            position: relative;
            z-index: 10;
        }

        .users-pagination .pagination {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: .35rem;
            margin-bottom: 0;
        }

        .users-pagination .page-link {
            border-radius: 12px !important;
            color: #a7eefb !important;
            background: rgba(15, 23, 42, .90) !important;
            border: 1px solid rgba(167, 238, 251, .20) !important;
        }

        .users-pagination .page-link:hover {
            color: #04111f !important;
            background: #a7eefb !important;
            border-color: #a7eefb !important;
        }

        .users-pagination .page-item.active .page-link {
            color: #04111f !important;
            background: #67e8f9 !important;
            border-color: #67e8f9 !important;
        }

        .users-pagination .page-item.disabled .page-link {
            color: rgba(148, 163, 184, .45) !important;
            background: rgba(15, 23, 42, .55) !important;
        }

        @media (max-width: 991.98px) {
            .users-top-actions {
                flex-direction: column;
                align-items: stretch !important;
            }

            .users-top-actions .btn {
                width: 100%;
            }
        }

        @media (max-width: 767.98px) {
            .dashboard-hero-title {
                font-size: 1.5rem;
            }

            .card-body {
                padding: 1.25rem !important;
            }

            .stats-value {
                font-size: 1.25rem;
            }
        }

        @media (max-width: 575.98px) {
            .dashboard-hero,
            .hero-info {
                padding: 1rem !important;
            }

            .dashboard-hero-title {
                font-size: 1.25rem;
            }

            .hud-title {
                font-size: 0.85rem;
            }

            .card-body {
                padding: 1rem !important;
            }

            .btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
            }
        }

/* ===== resources\views\users\transfer.blade.php :: <style> ===== */
:root {
        --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        --secondary-gradient: linear-gradient(135deg, #2dd4bf 0%, #14b8a6 100%);
        --dark-gradient: linear-gradient(135deg, rgba(15,23,42,.96), rgba(30,41,59,.88));
        --neon-cyan: #a7eefb;
        --neon-purple: #a78bfa;
        --transition-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }

    @keyframes slideInDown {
        from {
            opacity: 0;
            transform: translateY(-20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }

/* ===== ALERTES ===== */
    .alert {
        border-radius: 12px;
        border: 1px solid rgba(255,255,255,.1);
        animation: slideInDown 0.5s ease-out;
        backdrop-filter: blur(10px);
        transition: var(--transition-smooth);
    }

    .alert-success {
        background: rgba(16, 185, 129, 0.12);
        border-color: rgba(16, 185, 129, 0.3);
        color: #10b981;
    }

    .alert-danger {
        background: rgba(239, 68, 68, 0.12);
        border-color: rgba(239, 68, 68, 0.3);
        color: #ef4444;
    }

    .alert-dismissible .btn-close {
        filter: invert(1);
    }

/* ===== CARTES ===== */
    .card {
        border-color: rgba(45, 212, 191, 0.15) !important;
        border-radius: 1px !important;
        background: var(--dark-gradient) !important;
        box-shadow: 0 10px 40px rgba(0,0,0,.15) !important;
        transition: var(--transition-smooth);
        animation: fadeIn 0.6s ease-out;
        position: relative;
        overflow: hidden;
    }

    .card::before {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        z-index: 1;
    }

    .card > * {
        position: relative;
        z-index: 2;
    }

    .card:hover {
        border-color: rgba(45, 212, 191, 0.5) !important;
        box-shadow:
            0 0 30px rgba(45, 212, 191, 0.2),
            0 20px 50px rgba(0, 0, 0, 0.3) !important;
        transform: translateY(-4px);
    }

    .card-header,
    .card-footer {
        background: transparent !important;
        border-color: rgba(45, 212, 191, 0.1) !important;
        padding: 1.25rem !important;
    }

    .card-body {
        padding: 1.5rem !important;
    }

/* ===== TITRES ===== */
    .text-neon {
        background:  var(--neon-cyan);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 600;
        color: #2dd4bf !important;
    }

    .card-title {
        color: #fff;
        font-weight: 700;
    }

/* ===== TABLES ===== */
    .table {
        --bs-table-bg: transparent;
        --bs-table-color: #fff;
        --bs-table-border-color: rgba(45, 212, 191, 0.12);
        color: rgba(255,255,255,.92);
    }

    .table thead th {
        color: #f8fafc;
        font-size: .84rem;
        font-weight: 700;
        border-bottom-width: 1px;
        border-bottom-color: rgba(45, 212, 191, 0.2) !important;
        background: rgba(45, 212, 191, 0.08);
        vertical-align: middle;
        white-space: nowrap;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 0.9rem !important;
    }

    .table tbody td {
        color: rgba(255,255,255,.92);
        vertical-align: middle;
        border-color: rgba(45, 212, 191, 0.08) !important;
        padding: 0.9rem !important;
    }

    .table tbody tr {
        transition: var(--transition-smooth);
    }

    .table-striped > tbody > tr:nth-of-type(odd) > * {
        --bs-table-accent-bg: rgba(45, 212, 191, 0.04);
        background-color: rgba(45, 212, 191, 0.04) !important;
    }

    .table-hover > tbody > tr:hover > * {
        --bs-table-accent-bg: rgba(45, 212, 191, 0.12);
        background-color: rgba(45, 212, 191, 0.12) !important;
        color: #fff;
    }

    .table tfoot tr {
        background: rgba(45, 212, 191, 0.06);
        font-weight: 600;
        border-top: 1px solid rgba(45, 212, 191, 0.2);
    }

    .table a {
        color: #2dd4bf;
        text-decoration: none;
        transition: var(--transition-smooth);
    }

    .table a:hover {
        color: #a78bfa;
    }

/* ===== FORMULAIRES ===== */
    .form-select,
    select {
        border-color: rgba(45, 212, 191, 0.2) !important;
        background-color: rgba(15, 23, 42, 0.55) !important;
        color: #e5e7eb;
        border-radius: 8px;
        transition: var(--transition-smooth);
    }

    .form-select:focus,
    select:focus {
        border-color: rgba(45, 212, 191, 0.65) !important;
        box-shadow: 0 0 0 .2rem rgba(45, 212, 191, 0.15) !important;
        color: #fff;
        background-color: rgba(15, 23, 42, 0.75) !important;
    }

    .form-select::placeholder {
        color: rgba(255,255,255,.4);
    }

/* ===== BADGES ===== */
    .badge {
        border-radius: 8px;
        font-weight: 700;
        letter-spacing: 0.5px;
        backdrop-filter: blur(10px);
        padding: 0.45rem 0.75rem;
    }

    .badge.bg-success {
        background: linear-gradient(135deg, rgba(34, 197, 94, 0.3), rgba(74, 222, 128, 0.2)) !important;
        border: 1px solid rgba(34, 197, 94, 0.4);
        color: #4ade80;
    }

    .badge.bg-danger {
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.3), rgba(248, 113, 113, 0.2)) !important;
        border: 1px solid rgba(239, 68, 68, 0.4);
        color: #f87171;
    }

    .badge.bg-dark {
        background: linear-gradient(135deg, rgba(55, 65, 81, 0.3), rgba(107, 114, 128, 0.2)) !important;
        border: 1px solid rgba(107, 114, 128, 0.4);
        color: #d1d5db;
    }

/* ===== IMAGES & AVATARS ===== */
    .img-thumbnail {
        border-radius: 8px;
        border: 1px solid rgba(45, 212, 191, 0.2);
        background: rgba(15, 23, 42, 0.8);
        transition: var(--transition-smooth);
        cursor: pointer;
    }

    .img-thumbnail:hover {
        border-color: rgba(45, 212, 191, 0.6);
        box-shadow: 0 0 15px rgba(45, 212, 191, 0.2);
        transform: scale(1.05);
    }

/* ===== BOUTONS ===== */
    .btn {
        border-radius: 8px;
        font-weight: 600;
        letter-spacing: 0.4px;
        transition: var(--transition-smooth);
        padding: 0.65rem 1.5rem;
    }

    .btn-sm {
        padding: .45rem .7rem;
        font-size: .85rem;
    }

    .btn-danger {
        background: linear-gradient(135deg, rgb(239, 68, 68), rgb(220, 38, 38));
        border-color: rgba(239, 68, 68, 0.4);
        color: #fff;
    }

    .btn-danger:hover {
        border-color: rgba(239, 68, 68, 0.7);
        box-shadow: 0 0 20px rgba(239, 68, 68, 0.4);
        transform: translateY(-2px);
        background: linear-gradient(135deg, rgb(220, 38, 38), rgb(185, 28, 28));
    }

/* ===== CHECKBOX ===== */
    .checkbox-lg {
        width: 1.25rem;
        height: 1.25rem;
        accent-color: #2dd4bf;
        cursor: pointer;
        transition: var(--transition-smooth);
    }

    .checkbox-lg:hover {
        filter: drop-shadow(0 0 8px rgba(45, 212, 191, 0.4));
    }

/* ===== RESPONSIVE ===== */
    @media (max-width: 991.98px) {
        .card-body {
            padding: 1.25rem !important;
        }

        .table thead th {
            font-size: .78rem;
            padding: 0.7rem !important;
        }

        .table tbody td {
            font-size: .88rem;
            padding: 0.7rem !important;
        }
    }

    @media (max-width: 767.98px) {
        .card {
            border-radius: 12px !important;
        }

        .card-body {
            padding: 1rem !important;
        }

        .table thead th {
            font-size: .75rem;
            padding: 0.5rem !important;
        }

        .table tbody td {
            font-size: .80rem;
            padding: 0.5rem !important;
        }

        .btn {
            padding: 0.5rem 1rem;
            font-size: 0.85rem;
        }
    }

    @media (max-width: 575.98px) {
        .table-responsive {
            font-size: .75rem;
        }

        .table thead th {
            font-size: .7rem;
            padding: 0.4rem !important;
        }

        .table tbody td {
            font-size: .75rem;
            padding: 0.4rem !important;
        }

        .img-thumbnail {
            width: 32px !important;
            height: 40px !important;
        }

        .btn-sm {
            padding: .35rem .5rem;
            font-size: .75rem;
        }
    }

/* ===== resources\views\users\transfer.blade.php :: <style> ===== */
.checkbox-lg {
                                        width: 1.25rem;
                                        height: 1.25rem;
                                        /* optionnel : couleur cochée */
                                        accent-color: #0d6efd; /* Bootstrap primary */
                                    }

/* ===== resources\views\users_old\call_list.blade.php :: <style> ===== */
input {border:none !important}

/* ===== resources\views\users_old\edit.blade.php :: <style> ===== */
#calendar {
                                        min-height: 500px; /* Donne une vraie hauteur */
                                    }

/* ===== resources\views\users_old\edition_old.blade.php :: <style> ===== */
.modal-backdrop {
            background: transparent !important;
            pointer-events: none !important;
        }

/* ===== resources\views\users_old\index.blade.php :: <style> ===== */
:root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .86);
            --hud-card-2: rgba(7, 16, 28, .94);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-border-strong: rgba(45, 212, 191, .45);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
        }

        .users-old-page {
            padding-bottom: 3rem;
        }

        .users-hero {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            padding: 1.75rem;
            margin-bottom: 1.5rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .users-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
        }

        .users-hero-content {
            position: relative;
            z-index: 2;
        }

        .users-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .users-title {
            color: var(--hud-text);
            font-size: clamp(1.5rem, 3vw, 2.25rem);
            font-weight: 800;
            margin: 1rem 0 .35rem;
        }

        .users-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .users-actions {
            display: flex;
            justify-content: flex-end;
            gap: .75rem;
            flex-wrap: wrap;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .users-card {
            position: relative;
            overflow: hidden;
            border-radius: 24px;
            background:
            radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
            linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 22px 55px rgba(0, 0, 0, .32);
        }

        .users-card-header {
            position: relative;
            z-index: 2;
            padding: 1.25rem 1.5rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            flex-wrap: wrap;
        }

        .users-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: .15rem;
        }

        .users-card-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
            font-size: .9rem;
        }

        .users-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr {
            transition: background .2s ease;
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .table-user-muted {
            background: rgba(15, 23, 42, .72) !important;
            opacity: .72;
        }

        .user-avatar {
            width: 44px;
            height: 44px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(45, 212, 191, .28);
            background: rgba(15, 23, 42, .9);
            padding: 2px;
            transition: transform .2s ease, box-shadow .2s ease;
        }

        .user-avatar:hover {
            transform: scale(1.08);
            box-shadow: 0 0 18px rgba(45, 212, 191, .28);
        }

        .id-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 44px;
            padding: .35rem .55rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 800;
        }

        .gender-icon {
            width: 34px;
            height: 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            background: rgba(255, 255, 255, .06);
        }

        .btn-action {
            width: 38px;
            height: 38px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #a7eefb;
            background: rgba(15, 23, 42, .88);
            border: 1px solid rgba(167, 238, 251, .22);
        }

        .btn-action:hover {
            color: #04111f;
            background: #a7eefb;
            border-color: #a7eefb;
        }

        .dropdown-menu {
            border-radius: 16px;
            border: 1px solid rgba(45, 212, 191, .18);
            background: rgba(15, 23, 42, .98);
            box-shadow: 0 18px 42px rgba(0, 0, 0, .35);
            padding: .5rem;
        }

        .dropdown-item {
            border-radius: 12px;
            color: rgba(248, 250, 252, .86);
            font-weight: 600;
        }

        .dropdown-item:hover {
            color: #04111f;
            background: #a7eefb;
        }

        .dataTables_wrapper .dataTables_length label,
        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(226, 232, 240, .68) !important;
        }

        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select {
            border-radius: 13px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .dataTables_wrapper .form-control:focus,
        .dataTables_wrapper .form-select:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .page-link {
            border-radius: 12px !important;
            margin: 0 .12rem;
            color: #a7eefb;
            background: rgba(15, 23, 42, .90);
            border: 1px solid rgba(167, 238, 251, .20);
        }

        .page-item.active .page-link {
            color: #04111f;
            background: #67e8f9;
            border-color: #67e8f9;
        }

        .dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        @media (max-width: 767.98px) {
            .users-actions {
                justify-content: stretch;
            }

            .users-actions .btn {
                width: 100%;
            }

            .users-card-header,
            .users-card-body,
            .users-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\users_old\index.blade.php :: @push(css) ===== */

        :root {
            --hud-bg: #07101c;
            --hud-card: rgba(15, 23, 42, .86);
            --hud-card-2: rgba(7, 16, 28, .94);
            --hud-border: rgba(45, 212, 191, .20);
            --hud-border-strong: rgba(45, 212, 191, .45);
            --hud-text: #f8fafc;
            --hud-muted: rgba(226, 232, 240, .68);
            --hud-neon: #67e8f9;
            --hud-green: #2dd4bf;
        }

        .users-old-page {
            padding-bottom: 3rem;
        }

        .users-hero {
            position: relative;
            overflow: hidden;
            border-radius: 26px;
            padding: 1.75rem;
            margin-bottom: 1.5rem;
            background:
                radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
                linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
        }

        .users-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            background: repeating-linear-gradient(
                to bottom,
                rgba(255,255,255,.025) 0,
                rgba(255,255,255,.025) 1px,
                transparent 1px,
                transparent 7px
            );
            pointer-events: none;
        }

        .users-hero-content {
            position: relative;
            z-index: 2;
        }

        .users-badge {
            display: inline-flex;
            align-items: center;
            gap: .5rem;
            padding: .45rem .8rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .22);
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .08em;
            text-transform: uppercase;
        }

        .users-title {
            color: var(--hud-text);
            font-size: clamp(1.5rem, 3vw, 2.25rem);
            font-weight: 800;
            margin: 1rem 0 .35rem;
        }

        .users-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
        }

        .users-actions {
            display: flex;
            justify-content: flex-end;
            gap: .75rem;
            flex-wrap: wrap;
        }

        .btn-neon {
            border: 0;
            border-radius: 14px;
            color: #04111f;
            font-weight: 900;
            background: linear-gradient(135deg, #2dd4bf, #67e8f9);
            box-shadow: 0 12px 28px rgba(45, 212, 191, .22);
        }

        .btn-neon:hover {
            color: #04111f;
            transform: translateY(-1px);
            box-shadow: 0 18px 38px rgba(45, 212, 191, .30);
        }

        .btn-outline-neon {
            border-radius: 14px;
            color: #a7eefb;
            border-color: rgba(167, 238, 251, .45);
            background: rgba(255, 255, 255, .03);
            font-weight: 800;
        }

        .btn-outline-neon:hover {
            color: #04111f;
            border-color: #a7eefb;
            background: #a7eefb;
        }

        .users-card {
            position: relative;
            overflow: hidden;
            border-radius: 24px;
            background:
            radial-gradient(circle at top left, rgba(45, 212, 191, .18), transparent 35%),
            linear-gradient(135deg, rgba(7, 16, 28, .96), rgba(15, 23, 42, .88));
            border: 1px solid var(--hud-border);
            box-shadow: 0 22px 55px rgba(0, 0, 0, .32);
        }

        .users-card-header {
            position: relative;
            z-index: 2;
            padding: 1.25rem 1.5rem;
            border-bottom: 1px solid rgba(148, 163, 184, .14);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 1rem;
            flex-wrap: wrap;
        }

        .users-card-title {
            color: var(--hud-text);
            font-weight: 800;
            margin-bottom: .15rem;
        }

        .users-card-subtitle {
            color: var(--hud-muted);
            margin-bottom: 0;
            font-size: .9rem;
        }

        .users-card-body {
            position: relative;
            z-index: 2;
            padding: 1.25rem;
        }

        .table {
            color: rgba(248, 250, 252, .88);
            margin-bottom: 0;
        }

        .table thead th {
            color: #a7eefb;
            background: rgba(15, 23, 42, .95);
            border-bottom: 1px solid rgba(45, 212, 191, .25);
            font-size: .78rem;
            text-transform: uppercase;
            letter-spacing: .06em;
            white-space: nowrap;
        }

        .table tbody td {
            vertical-align: middle;
            border-color: rgba(148, 163, 184, .12);
        }

        .table tbody tr {
            transition: background .2s ease;
        }

        .table tbody tr:hover {
            background: rgba(45, 212, 191, .08);
        }

        .table-user-muted {
            background: rgba(15, 23, 42, .72) !important;
            opacity: .72;
        }

        .user-avatar {
            width: 44px;
            height: 44px;
            object-fit: cover;
            border-radius: 14px;
            border: 1px solid rgba(45, 212, 191, .28);
            background: rgba(15, 23, 42, .9);
            padding: 2px;
            transition: transform .2s ease, box-shadow .2s ease;
        }

        .user-avatar:hover {
            transform: scale(1.08);
            box-shadow: 0 0 18px rgba(45, 212, 191, .28);
        }

        .id-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 44px;
            padding: .35rem .55rem;
            border-radius: 999px;
            color: #9ffaf0;
            background: rgba(45, 212, 191, .10);
            border: 1px solid rgba(45, 212, 191, .18);
            font-weight: 800;
        }

        .gender-icon {
            width: 34px;
            height: 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            background: rgba(255, 255, 255, .06);
        }

        .btn-action {
            width: 38px;
            height: 38px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #a7eefb;
            background: rgba(15, 23, 42, .88);
            border: 1px solid rgba(167, 238, 251, .22);
        }

        .btn-action:hover {
            color: #04111f;
            background: #a7eefb;
            border-color: #a7eefb;
        }

        .dropdown-menu {
            border-radius: 16px;
            border: 1px solid rgba(45, 212, 191, .18);
            background: rgba(15, 23, 42, .98);
            box-shadow: 0 18px 42px rgba(0, 0, 0, .35);
            padding: .5rem;
        }

        .dropdown-item {
            border-radius: 12px;
            color: rgba(248, 250, 252, .86);
            font-weight: 600;
        }

        .dropdown-item:hover {
            color: #04111f;
            background: #a7eefb;
        }

        .dataTables_wrapper .dataTables_length label,
        .dataTables_wrapper .dataTables_filter label,
        .dataTables_wrapper .dataTables_info {
            color: rgba(226, 232, 240, .68) !important;
        }

        .dataTables_wrapper .form-control,
        .dataTables_wrapper .form-select {
            border-radius: 13px;
            color: #f8fafc;
            background-color: rgba(15, 23, 42, .92);
            border: 1px solid rgba(148, 163, 184, .24);
        }

        .dataTables_wrapper .form-control:focus,
        .dataTables_wrapper .form-select:focus {
            color: #fff;
            background-color: rgba(15, 23, 42, .98);
            border-color: rgba(45, 212, 191, .75);
            box-shadow: 0 0 0 .25rem rgba(45, 212, 191, .12);
        }

        .page-link {
            border-radius: 12px !important;
            margin: 0 .12rem;
            color: #a7eefb;
            background: rgba(15, 23, 42, .90);
            border: 1px solid rgba(167, 238, 251, .20);
        }

        .page-item.active .page-link {
            color: #04111f;
            background: #67e8f9;
            border-color: #67e8f9;
        }

        .dt-buttons {
            display: none !important;
            visibility: hidden !important;
        }

        @media (max-width: 767.98px) {
            .users-actions {
                justify-content: stretch;
            }

            .users-actions .btn {
                width: 100%;
            }

            .users-card-header,
            .users-card-body,
            .users-hero {
                padding: 1rem;
            }
        }

/* ===== resources\views\weight-readings\index.blade.php :: <style> ===== */
.card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

        .table > :not(caption) > * > * {
            padding-top: 0.9rem;
            padding-bottom: 0.9rem;
        }

        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12) !important;
        }

        .bg-success-subtle {
            background-color: rgba(25, 135, 84, 0.12) !important;
        }

        .bg-warning-subtle {
            background-color: rgba(255, 193, 7, 0.15) !important;
        }

        .bg-danger-subtle {
            background-color: rgba(220, 53, 69, 0.12) !important;
        }
        .bg-orange-subtle {
            background-color: rgba(253, 126, 20, 0.15) !important;
        }

        .text-orange {
            color: #fd7e14 !important;
        }

        .bmi-target-line {
            border-top: 2px dashed rgba(173, 181, 189, 0.8);
        }

/* ===== resources\views\weight-readings\index.blade.php :: @push(css) ===== */

        .card {
            transition: border-color .35s ease, box-shadow .35s ease, transform .35s ease;
        }

        .card:hover {
            background-color: #19202c;
            border-color: rgba(45, 212, 191, 0.9) !important;
            box-shadow:
                0 0 0 1px rgba(45, 212, 191, 0.35),
                0 0 10px rgba(45, 212, 191, 0.45),
                0 0 18px rgba(45, 212, 191, 0.22),
                0 10px 21px rgba(0, 0, 0, 0.45) !important;
        }

        .table > :not(caption) > * > * {
            padding-top: 0.9rem;
            padding-bottom: 0.9rem;
        }

        .bg-primary-subtle {
            background-color: rgba(13, 110, 253, 0.12) !important;
        }

        .bg-success-subtle {
            background-color: rgba(25, 135, 84, 0.12) !important;
        }

        .bg-warning-subtle {
            background-color: rgba(255, 193, 7, 0.15) !important;
        }

        .bg-danger-subtle {
            background-color: rgba(220, 53, 69, 0.12) !important;
        }
        .bg-orange-subtle {
            background-color: rgba(253, 126, 20, 0.15) !important;
        }

        .text-orange {
            color: #fd7e14 !important;
        }

        .bmi-target-line {
            border-top: 2px dashed rgba(173, 181, 189, 0.8);
        }