/* ===========================================================
   Tailwind CSS + MudBlazor Override Styles
   MudBlazor bileşenleri korunur, Tailwind sadece özel
   bileşenlerde/layout'ta kullanılır.
   =========================================================== */

/* Material Symbols font settings */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Quill editor styling overrides for admin panel */
.ql-toolbar.ql-snow {
    border-radius: 0 !important;
    border-color: #e0e0e0 !important;
    background: #f8fafc !important;
}

.ql-container.ql-snow {
    border-radius: 0 !important;
    border-color: #e0e0e0 !important;
    font-family: 'Inter', 'Roboto', sans-serif !important;
    font-size: 15px !important;
}

.ql-editor {
    min-height: 300px;
    line-height: 1.7;
}

.ql-editor p {
    margin-bottom: 0.75em;
}

.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4 {
    margin-top: 1em;
    margin-bottom: 0.5em;
    font-weight: 700;
}

.ql-editor blockquote {
    border-left: 4px solid #1a227f;
    padding-left: 1rem;
    color: #475569;
    font-style: italic;
}

/* Admin card styles (shared) */
.hp-card {
    background: white;
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid #e0e0e0;
    padding: 1rem; /* Tighter padding (16px) */
}

.hp-card-header {
    font-size: 0.95rem; /* Smaller header (15px) */
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem; /* Tighter bottom margin (16px) */
    color: #1d3557;
}

/* Prevent MudBlazor input conflicts */
.mud-input-control .mud-input {
    font-family: 'Inter', 'Roboto', sans-serif;
}

/* Sticky header for news pages */
.hp-sticky-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: white;
    border-bottom: 1px solid #e2e8f0;
    padding: 1rem 1.5rem;
}

/* SEO score circle animation */
@keyframes seo-score-fill {
    from {
        stroke-dashoffset: 213.6;
    }
}

/* Toggle switch Tailwind style */
.hp-toggle input:checked+div {
    background-color: #1a227f;
}

/* -- Photo editor overlay - ensure hover visibility -- */
.group:hover>.opacity-0 {
    opacity: 1 !important;
}

.group>.opacity-0 {
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    z-index: 10;
}

/* -- Ensure images (including WebP) display correctly -- */
img[src$=".webp"],
img[src*="/media/"],
img[src*="/uploads/"] {
    image-rendering: auto;
    max-width: 100%;
    height: auto;
}

/* --- Ultra-Dense Sidebar (Drawer) Links --- */
.mud-drawer .mud-nav-item .mud-nav-link {
    transition: all 0.2s ease-in-out;
    margin: 1px 4px; /* Extreme compact margins */
    border-radius: 0px !important;
    padding: 5px 8px; /* Specifically requested tight padding */
    font-size: 12px !important; /* Specifically requested 12px */
    min-height: 32px !important;
}

.mud-drawer .mud-nav-item .mud-nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #ffffff !important;
}

.mud-drawer .mud-nav-item .mud-nav-link.active {
    background-color: rgba(255, 255, 255, 0.1) !important; 
    color: #ffffff !important;
    border-left: 3px solid #3b82f6 !important;
}

.mud-drawer .mud-nav-item .mud-nav-link .mud-nav-link-icon {
    color: #94a3b8 !important; /* Slate 400 */
    font-size: 16px !important; /* Smaller icons to match 12px text */
    margin-right: 6px !important;
}

.mud-drawer .mud-nav-item .mud-nav-link:hover .mud-nav-link-icon,
.mud-drawer .mud-nav-item .mud-nav-link.active .mud-nav-link-icon {
    color: #ffffff !important;
}

/* ==========================================================
   PHASE 6.4: PREMIUM FLAT UI & SPACING INJECTION
   Eliminates all 3D shadow effects and enforces strict 1px
   borders. Overrides dense tables globally for readability.
   ========================================================== */

/* 1. Global MudCard and MudPaper Elevation Killer */
.mud-elevation-1, .mud-elevation-2, .mud-elevation-3, .mud-elevation-4 {
    box-shadow: none !important;
    border: 1px solid #e2e8f0 !important;
}

/* 2. AppBar Border Fix (No side borders) */
.mud-appbar {
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

/* 3. Ultra Dense Table Adjustments */
.mud-table-root .mud-table-cell {
    padding: 6px 8px !important; /* Tightly packed rows */
    font-size: 12.5px !important; /* Shrunk text */
    line-height: 1.3 !important;
}

.mud-table-root th.mud-table-cell {
    font-weight: 600 !important;
    color: #475569 !important;
    background-color: #f8fafc !important; 
    padding: 6px 8px !important;
    text-transform: uppercase;
    font-size: 11px !important;
    letter-spacing: 0.02em;
}