/* =====================================================================
   Orar Notiqo — Temă vizuală în paleta proiectului tehnic (PDF)
   ===================================================================== */

:root {
    --navy-900: #19243d;
    --navy-800: #1f2c4a;
    --navy-700: #26365c;
    --navy-600: #2f4067;
    --navy-100: #dfe4ec;
    --navy-50: #eef1f6;

    --accent-600: #5d41c2;
    --accent-500: #7255d9;
    --accent-400: #9a83e6;
    --accent-50: #f0ecfb;

    --ink: #2b3550;
    --body: #3a3f4b;
    --muted: #737780;
    --surface: #f8f9fc;
    --line: #dfe4ec;
}

body {
    background: var(--surface);
    color: var(--body);
    font-family: 'Instrument Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5,
.sidebar-heading, .navbar-brand {
    font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    color: var(--ink);
}

header.navbar,
.navbar.navbar-light {
    /*background: var(--navy-900) !important;*/
    border-bottom: 3px solid var(--accent-500);
    box-shadow: 0 2px 10px rgba(25, 36, 61, .25);
}

header.navbar .navbar-brand,
header.navbar .navbar-brand * {
    color: #fff !important;
}

.sidebar {
    background: var(--navy-800);
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, .04);
    padding-top: .5rem;
}

.sidebar .sidebar-heading {
    color: var(--accent-400);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .72rem;
    font-weight: 700;
    padding: 1rem 1rem .35rem;
    font-family: 'Instrument Sans', sans-serif;
}

.sidebar .nav-link {
    color: #c7cedd;
    border-radius: 8px;
    margin: 2px 8px;
    padding: .55rem .75rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    transition: background .15s ease, color .15s ease;
}

.sidebar .nav-link i {
    color: #8b97b5;
    transition: color .15s ease;
}

.sidebar .nav-link:hover {
    background: rgba(255, 255, 255, .06);
    color: #fff;
}

.sidebar .nav-link:hover i {
    color: var(--accent-400);
}

.sidebar .nav-link.active {
    background: var(--accent-500);
    color: #fff;
    box-shadow: 0 4px 12px rgba(114, 85, 217, .35);
}

.sidebar .nav-link.active i {
    color: #fff;
}

.page-title,
main h1:first-of-type,
.content-title {
    position: relative;
    padding-bottom: .6rem;
    margin-bottom: 1.4rem;
}

.page-title::after,
.content-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 56px;
    height: 4px;
    background: var(--accent-500);
    border-radius: 2px;
}

.card {
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(25, 36, 61, .05);
}

.card .card-header {
    background: #fff;
    border-bottom: 1px solid var(--line);
    font-weight: 600;
    color: var(--ink);
}

.table {
    color: var(--body);
    border-color: var(--line);
}

.table > thead {
    background: var(--navy-700);
}

.table > thead th {
    /*color: #fff;*/
    font-weight: 600;
    border-color: var(--navy-600);
    text-transform: none;
    letter-spacing: .01em;
}

.table > tbody tr:nth-of-type(odd) > * {
    background: var(--surface);
}

.table > tbody td, .table > tbody th {
    border-color: var(--line);
    vertical-align: middle;
}

.table-hover > tbody > tr:hover > * {
    background: var(--accent-50);
}

.btn-primary {
    background: var(--accent-500);
    border-color: var(--accent-500);
    color: #fff;
}

.btn-primary:hover, .btn-primary:focus {
    background: var(--accent-600);
    border-color: var(--accent-600);
}

.btn-outline-primary {
    color: var(--accent-600);
    border-color: var(--accent-500);
}

.btn-outline-primary:hover {
    background: var(--accent-500);
    border-color: var(--accent-500);
    color: #fff;
}

.btn-secondary,
.btn-dark {
    background: var(--navy-700);
    border-color: var(--navy-700);
    color: #fff;
}

.btn-secondary:hover, .btn-dark:hover {
    background: var(--navy-800);
    border-color: var(--navy-800);
}

.badge.bg-primary {
    background: var(--accent-500) !important;
    color:white!important;
}

.badge.bg-navy {
    background: var(--navy-700) !important;
    color: #fff;
}

.form-control:focus, .form-select:focus {
    border-color: var(--accent-400);
    box-shadow: 0 0 0 .2rem rgba(114, 85, 217, .15);
}


.callout-accent, .callout-navy {
    border-radius: 10px;
    padding: 1rem 1.15rem;
    margin: 1rem 0;
}

.callout-accent {
    background: var(--accent-50);
    border-left: 4px solid var(--accent-500);
}

.callout-navy {
    background: var(--navy-50);
    border-left: 4px solid var(--navy-700);
}

.callout-accent .callout-label,
.callout-navy .callout-label {
    display: block;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .72rem;
    font-weight: 700;
    margin-bottom: .35rem;
}

.callout-accent .callout-label {
    color: var(--accent-600);
}

.callout-navy .callout-label {
    color: var(--navy-700);
}

.lesson-locked {
    background: #e7f4ec;
    border-left: 4px solid #2e9e5b;
}

.lesson-cascaded {
    background: #fbf3dc;
    border-left: 4px solid #e0a72b;
}

.lesson-auto {
    background: #fff;
    border-left: 4px solid var(--navy-100);
}
