/**
 * Base Styles
 * Reset, Typography, Genel stiller
 * Universe Moodle Theme
 *
 * @package AycaHanim
 */

/* ============== RESET / BASE ============== */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: "Manrope", Arial, sans-serif;
    font-size: var(--text-base);
    font-weight: 400;
    line-height: 1.6;
    color: var(--text-color);
    background-color: var(--body-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Topbar için padding */
body.has-topbar {
    padding-top: var(--topbar-height);
}

/* Duyuru barı varken body padding'i artır */
body.has-topbar.has-announcement {
    padding-top: calc(var(--topbar-height) + var(--announcement-height));
}

/* ============== TYPOGRAPHY ============== */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5em;
    font-weight: 700;
    line-height: 1.3;
    color: var(--primary-color-900, #181c3d);
}

h1 { font-size: var(--text-3xl); }
h2 { font-size: var(--text-2xl); }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-lg); }
h5 { font-size: var(--text-base); }
h6 { font-size: var(--text-sm); }

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

/* ============== LINKS ============== */
a {
    color: var(--main-theme-color);
    text-decoration: none;
    transition: color var(--transition-normal);
}

a:hover {
    color: var(--primary-color-500);
}

/* Animated underline (Universe signature) */
.underline--anim {
    position: relative;
    display: inline-block;
}

.underline--anim::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -5px;
    right: 0;
    background-color: var(--primary-color-500);
    transition: width var(--transition-slow);
}

.underline--anim:hover::after {
    width: 100%;
    right: auto;
    left: 0;
}

/* ============== LISTS ============== */
ul, ol {
    padding-left: 1.5rem;
}

ul.list-unstyled,
ol.list-unstyled {
    padding-left: 0;
    list-style: none;
}

/* ============== IMAGES ============== */
img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

/* ============== CONTAINER ============== */
.container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

.container-fluid {
    width: 100%;
    padding: 0 var(--container-padding);
}

/* ============== SECTIONS ============== */
.section {
    padding: var(--section-padding) 0;
}

.section-sm {
    padding: calc(var(--section-padding) / 2) 0;
}

.section-title {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--primary-color-900, #181c3d);
    margin-bottom: 1rem;
}

.section-subtitle {
    font-size: var(--text-base);
    color: var(--gray-600);
    margin-bottom: 2rem;
}

/* Section with background */
.section-light {
    background-color: var(--gray-100);
}

.section-white {
    background-color: var(--card-bg);
}

/* ============== ROW & GRID ============== */
/* Bootstrap 5 .row kullanılıyor, override yok */

.col {
    flex: 1;
    padding: 0 15px;
}

/* Auto-fill grid (Universe style) */
.grid-auto {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--card-gap);
}

.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--card-gap);
}

.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.grid-6 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* ============== UTILITIES ============== */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.text-primary { color: var(--main-theme-color) !important; }
.text-secondary { color: var(--text-color-secondary) !important; }
.text-success { color: var(--success) !important; }
.text-danger { color: var(--danger) !important; }
.text-warning { color: var(--warning) !important; }
.text-muted { color: var(--gray-600) !important; }
.text-white { color: #fff !important; }

.bg-primary { background-color: var(--main-theme-color) !important; }
.bg-light { background-color: var(--gray-100) !important; }
.bg-white { background-color: #fff !important; }
.bg-dark { background-color: var(--primary-color-900) !important; }

.fw-400 { font-weight: 400 !important; }
.fw-500 { font-weight: 500 !important; }
.fw-600 { font-weight: 600 !important; }
.fw-700 { font-weight: 700 !important; }

.fs-xs { font-size: var(--text-xs) !important; }
.fs-sm { font-size: var(--text-sm) !important; }
.fs-base { font-size: var(--text-base) !important; }
.fs-lg { font-size: var(--text-lg) !important; }
.fs-xl { font-size: var(--text-xl) !important; }

/* Margins */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }

.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; }

/* Paddings */
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

.px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }

.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }

/* Display */
.d-flex { display: flex !important; }
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-none { display: none !important; }
.d-grid { display: grid !important; }

.flex-column { flex-direction: column !important; }
.flex-wrap { flex-wrap: wrap !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-around { justify-content: space-around !important; }
.align-items-center { align-items: center !important; }
.align-items-start { align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important; }

.gap-1 { gap: 0.25rem !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }

.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }

/* ============== RESPONSIVE ============== */
@media (max-width: 767.98px) {
    .section {
        padding: var(--section-padding-mobile) 0;
    }

    .grid-auto {
        grid-template-columns: 1fr;
        gap: var(--card-gap-mobile);
    }

    .grid-3,
    .grid-4,
    .grid-6 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    h1 { font-size: var(--text-2xl); }
    h2 { font-size: var(--text-xl); }

    .d-mobile-none { display: none !important; }
    .d-mobile-block { display: block !important; }
    .text-mobile-center { text-align: center !important; }
}

@media (min-width: 768px) and (max-width: 1099px) {
    .grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid-6 {
        grid-template-columns: repeat(2, 1fr);
    }

    .d-tablet-none { display: none !important; }
}

@media (min-width: 768px) {
    .d-md-flex { display: flex !important; }
    .d-md-block { display: block !important; }
    .d-md-none { display: none !important; }
}

@media (min-width: 1100px) {
    .d-lg-flex { display: flex !important; }
    .d-lg-block { display: block !important; }
    .d-lg-none { display: none !important; }
}

/* Cookie consent stilleri footer.php içinde tanımlıdır */