/* ============================================
   RUHSAT FORM — Tema değişkenleri (Ayarlar'dan)
   ============================================ */
.ruhsat-modal-wrapper {
    --ruhsat-page-bg-start: #f2c4c9;
    --ruhsat-page-bg-mid: #e8aab0;
    --ruhsat-page-bg-end: #dfa8ae;
    --ruhsat-page-border: #8f3042;
    --ruhsat-page-inner-border: rgba(143, 48, 66, 0.28);
    --ruhsat-title-bg: #9a3650;
    --ruhsat-title-bg-end: #7a2438;
    --ruhsat-title-border: #5c1828;
    --ruhsat-field-bg: #fffdf9;
    --ruhsat-field-bg-end: #faf4ec;
    --ruhsat-field-border: #8f3042;
    --ruhsat-field-focus: #6b2030;
    --ruhsat-label: #6b2030;
    --ruhsat-text: #3d1520;
    --ruhsat-placeholder: rgba(107, 32, 48, 0.28);
    --ruhsat-accent: #7a2438;
    --ruhsat-accent-light: #f0d4d8;
}
#ruhsat-modal .modal-content.ruhsat-modal-panel {
    max-width: 1080px;
    padding: 0;
    overflow: hidden;
}
#ruhsat-modal .modal-body.ruhsat-modal-body {
    padding: 10px 12px 12px;
}
.ruhsat-modal-wrapper .pages-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    max-width: 100%;
    align-items: stretch;
}
.ruhsat-modal-wrapper .page {
    min-width: 0;
    height: 100%;
    background: linear-gradient(165deg, var(--ruhsat-page-bg-start) 0%, var(--ruhsat-page-bg-mid) 42%, var(--ruhsat-page-bg-end) 100%);
    border-radius: 2px;
    padding: 10px 11px 11px;
    border: 2px solid var(--ruhsat-page-border);
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,0.35),
        0 2px 10px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: column;
    position: relative;
}
.ruhsat-modal-wrapper .page::before {
    content: '';
    position: absolute;
    inset: 5px;
    border: 1px solid var(--ruhsat-page-inner-border);
    pointer-events: none;
}
.ruhsat-modal-wrapper .page-title {
    text-align: center;
    font-size: 11px;
    font-weight: 800;
    color: #fff8f4;
    background: linear-gradient(180deg, var(--ruhsat-title-bg) 0%, var(--ruhsat-title-bg-end) 100%);
    border: 1px solid var(--ruhsat-title-border);
    padding: 5px 8px;
    margin: 0 0 8px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}
.ruhsat-modal-wrapper .field-group {
    margin-bottom: 0;
    border: 1px solid var(--ruhsat-field-border);
    border-radius: 1px;
    background: linear-gradient(180deg, var(--ruhsat-field-bg) 0%, var(--ruhsat-field-bg-end) 100%);
    padding: 2px 6px 3px;
    min-height: 36px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    flex-shrink: 0;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.ruhsat-modal-wrapper .field-group:focus-within {
    border-color: var(--ruhsat-field-focus);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 0 0 2px color-mix(in srgb, var(--ruhsat-field-focus) 15%, transparent);
}
.ruhsat-modal-wrapper .field-group .field-label {
    font-size: 8.5px;
    font-weight: 800;
    color: var(--ruhsat-label);
    letter-spacing: 0.35px;
    text-transform: uppercase;
    margin-bottom: 0;
    line-height: 1.15;
    font-family: 'Inter', system-ui, sans-serif;
}
.ruhsat-modal-wrapper .field-group input,
.ruhsat-modal-wrapper .field-group select,
.ruhsat-modal-wrapper .field-group textarea {
    width: 100%;
    border: none;
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    font-family: 'Times New Roman', Times, serif;
    background: transparent;
    color: var(--ruhsat-text);
    outline: none;
    min-height: 18px;
    line-height: 1.25;
    resize: vertical;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}
.ruhsat-modal-wrapper .field-group input[type="date"] {
    min-height: 20px;
    font-size: 12px;
}
.ruhsat-modal-wrapper .field-group input::placeholder,
.ruhsat-modal-wrapper .field-group select::placeholder,
.ruhsat-modal-wrapper .field-group textarea::placeholder {
    color: var(--ruhsat-placeholder);
    font-weight: 500;
}
.ruhsat-modal-wrapper .field-group textarea {
    min-height: 22px;
}
.ruhsat-modal-wrapper .field-group .required {
    color: #b91c1c;
    font-weight: 800;
}
.ruhsat-modal-wrapper .field-group select {
    padding-right: 2px;
    cursor: pointer;
}

/* OCR / manuel doldurma — dolu: soft yeşil, boş: soft kırmızı */
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-dolu {
    background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
    border-color: #6ee7b7;
}
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-bos {
    background: linear-gradient(180deg, #fff5f5 0%, #fee2e2 100%);
    border-color: #fca5a5;
}
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-dolu:focus-within {
    border-color: #34d399;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 0 0 2px rgba(52, 211, 153, 0.22);
}
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-bos:focus-within {
    border-color: #f87171;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 0 0 2px rgba(248, 113, 113, 0.22);
}
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-dolu .field-label {
    color: #047857;
}
.ruhsat-modal-wrapper.ruhsat-alan-durum-aktif .field-group.ruhsat-alan-bos .field-label {
    color: #b91c1c;
}

.ruhsat-modal-wrapper .field-group.height-2x {
    min-height: 52px;
}
.ruhsat-modal-wrapper .field-group.height-2x textarea {
    min-height: 32px;
}
.ruhsat-modal-wrapper .field-group.height-3x {
    min-height: 72px;
}
.ruhsat-modal-wrapper .field-group.height-3x textarea {
    min-height: 52px;
}
.ruhsat-modal-wrapper .field-group.height-4x {
    min-height: 92px;
}
.ruhsat-modal-wrapper .field-group.height-4x textarea {
    min-height: 72px;
}
.ruhsat-modal-wrapper .page-empty .field-group {
    min-height: 38px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-2x {
    min-height: 56px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-3x {
    min-height: 76px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-4x {
    min-height: 96px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-2x textarea {
    min-height: 36px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-3x textarea {
    min-height: 56px;
}
.ruhsat-modal-wrapper .page-empty .field-group.height-4x textarea {
    min-height: 76px;
}

/* Sayfa gövdesi — 2. sayfada kalan yüksekliği alanlara dağıt */
.ruhsat-modal-wrapper .page-body {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 1;
    min-height: 0;
}
.ruhsat-modal-wrapper .page > .field-group {
    margin-bottom: 5px;
}
.ruhsat-modal-wrapper .page-body > .field-group,
.ruhsat-modal-wrapper .page-body > .row-2col {
    margin-bottom: 0;
}
.ruhsat-modal-wrapper .page-body--stretch > .field-group:not(.height-2x):not(.height-3x):not(.height-4x) {
    flex: 0 0 auto;
}
.ruhsat-modal-wrapper .page-body--stretch > .field-group.height-2x,
.ruhsat-modal-wrapper .page-body--stretch > .row-2col {
    flex: 1 1 0;
    min-height: 52px;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .row-2col {
    align-items: stretch;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .row-2col .col {
    display: flex;
    flex-direction: column;
    min-height: 0;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .row-2col .field-group,
.ruhsat-modal-wrapper .page-empty .page-body--stretch .row-2col .noter-fields-wrapper {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    justify-content: flex-start;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .field-group.height-2x,
.ruhsat-modal-wrapper .page-empty .page-body--stretch .field-group.height-3x,
.ruhsat-modal-wrapper .page-empty .page-body--stretch .field-group.height-4x {
    min-height: 48px;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .field-group textarea {
    flex: 1 1 auto;
    min-height: 24px;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .noter-fields-wrapper {
    display: flex;
    flex-direction: column;
    gap: 5px;
    height: 100%;
}
.ruhsat-modal-wrapper .page-empty .page-body--stretch .noter-fields-wrapper .noter-item,
.ruhsat-modal-wrapper .page-empty .page-body--stretch .noter-fields-wrapper .noter-item-2 {
    flex: 1 1 0;
    min-height: 36px;
}

/* Modal başlık — ruhsat teması */
#ruhsat-modal .modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, var(--ruhsat-title-bg) 0%, var(--ruhsat-title-bg-end) 55%, var(--ruhsat-field-focus) 100%);
    padding: 8px 12px;
    border-radius: 0;
}

/* Sekme çubuğu + görünüm seçici */
.ruhsat-sekme-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px;
    border-bottom: 2px solid var(--ruhsat-accent-light);
    margin-bottom: 8px;
    padding-bottom: 0;
}
.ruhsat-sekme-grup { display: flex; flex-wrap: wrap; }
.ruhsat-tab-btn {
    background: none;
    border: none;
    padding: 8px 16px;
    font-weight: 600;
    color: #9ca3af;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    font-size: 13px;
    transition: color 0.2s, border-color 0.2s;
}
.ruhsat-tab-btn:hover { color: var(--ruhsat-accent); }
.ruhsat-tab-btn.active {
    color: var(--ruhsat-accent);
    border-bottom-color: var(--ruhsat-field-border);
}
.ruhsat-gorunum-secici {
    display: flex;
    align-items: center;
    gap: 3px;
    background: color-mix(in srgb, var(--ruhsat-accent-light) 60%, #fff);
    padding: 3px;
    border-radius: 8px;
    border: 1px solid var(--ruhsat-accent-light);
    animation: ruhsatFadeIn 0.25s ease;
}
.ruhsat-gorunum-btn {
    border: none;
    background: transparent;
    color: #9ca3af;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 0.2s;
}
.ruhsat-gorunum-btn:hover { color: var(--ruhsat-accent); background: color-mix(in srgb, var(--ruhsat-accent) 8%, transparent); }
.ruhsat-gorunum-btn.active {
    background: #fff;
    color: var(--ruhsat-accent);
    box-shadow: 0 1px 3px rgba(107, 32, 48, 0.12);
}
@keyframes ruhsatFadeIn {
    from { opacity: 0; transform: translateX(8px); }
    to { opacity: 1; transform: translateX(0); }
}
.ruhsat-modal-wrapper .row-2col {
    display: flex;
    flex-wrap: nowrap;
    gap: 5px;
    margin-bottom: 5px;
    align-items: stretch;
}
.ruhsat-modal-wrapper .row-2col .col {
    flex: 1 1 50%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.ruhsat-modal-wrapper .row-2col .col .field-group {
    height: 100%;
}
.ruhsat-modal-wrapper .row-3col {
    display: flex;
    flex-wrap: nowrap;
    gap: 5px;
    margin-bottom: 5px;
}
.ruhsat-modal-wrapper .row-3col .col-50 {
    flex: 1 1 50%;
    min-width: 0;
}
.ruhsat-modal-wrapper .row-3col .col-25 {
    flex: 1 1 25%;
    min-width: 0;
}
.ruhsat-modal-wrapper .row-3col .col-50 .field-group,
.ruhsat-modal-wrapper .row-3col .col-25 .field-group {
    height: 100%;
}
.ruhsat-modal-wrapper .noter-fields-wrapper {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    height: 100%;
}
.ruhsat-modal-wrapper .noter-fields-wrapper .noter-item {
    flex: 1;
}
.ruhsat-modal-wrapper .noter-fields-wrapper .noter-item-2 {
    flex: 2;
}
.ruhsat-modal-wrapper .noter-fields-wrapper .field-group {
    height: 100%;
}
.ruhsat-modal-wrapper .page > .field-group {
    margin-bottom: 5px;
}

/* Leaderboard (Afiş) reklam alanı — ruhsat formu ile aynı genişlik */
#ruhsat-leaderboard-slot,
.ruhsat-leaderboard-afis {
    width: 100%;
}
.ruhsat-leaderboard-afis {
    margin: 8px 0 6px;
    position: relative;
    z-index: 1;
}
.ruhsat-leaderboard-afis-etiket {
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.55px;
    color: #9ca3af;
    margin-bottom: 4px;
    text-align: center;
}
.ruhsat-leaderboard-afis-cerceve {
    width: 100%;
    aspect-ratio: 728 / 90;
    min-height: 54px;
    border: 1px dashed var(--ruhsat-accent-light);
    border-radius: 4px;
    overflow: hidden;
    background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
    display: flex;
    align-items: center;
    justify-content: center;
}
.ruhsat-leaderboard-afis-cerceve a {
    display: block;
    width: 100%;
    height: 100%;
}
.ruhsat-leaderboard-afis-cerceve img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    background: #fff;
}
.ruhsat-leaderboard-afis-placeholder {
    text-align: center;
    padding: 8px 12px;
    color: #9ca3af;
    line-height: 1.35;
}
.ruhsat-leaderboard-afis-placeholder i {
    display: block;
    font-size: 20px;
    color: var(--ruhsat-accent);
    opacity: 0.55;
    margin-bottom: 4px;
}
.ruhsat-leaderboard-afis-placeholder strong {
    display: block;
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 2px;
}
.ruhsat-leaderboard-afis-placeholder span {
    display: block;
    font-size: 11px;
    color: #9ca3af;
}
.ruhsat-leaderboard-afis-placeholder small {
    display: block;
    font-size: 9px;
    color: #d1d5db;
    margin-top: 4px;
}
.ruhsat-leaderboard-afis-cerceve--dolu {
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.08);
    background: #0f172a;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
}
.ruhsat-leaderboard-afis--lerta .ruhsat-leaderboard-afis-etiket {
    color: #94a3b8;
}

/* Lerta varsayılan leaderboard reklamı — 5 sn animasyon döngüsü */
.ruhsat-lb-lerta {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: #fff;
    overflow: hidden;
    box-sizing: border-box;
}
.ruhsat-lb-lerta--anim:hover .ruhsat-lb-lerta-bg {
    filter: brightness(1.07);
}
.ruhsat-lb-lerta-bg {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(115deg, rgba(249, 115, 22, 0.95) 0%, rgba(234, 88, 12, 0.9) 40%, rgba(124, 58, 237, 0.92) 100%);
    z-index: 0;
    animation: ruhsatLbBgPulse 5s ease-in-out infinite;
}
.ruhsat-lb-lerta-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 15% 50%, rgba(255,255,255,0.25) 0%, transparent 45%),
        radial-gradient(circle at 85% 40%, rgba(255,255,255,0.14) 0%, transparent 38%),
        repeating-linear-gradient(-55deg, rgba(255,255,255,0.05) 0 2px, transparent 2px 12px);
    opacity: 0.95;
}
.ruhsat-lb-lerta-anim-stage {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.ruhsat-lb-lerta-anim-alt {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px 20px;
    gap: 4px;
    animation: ruhsatLbAltFade 5s ease-in-out infinite;
}
.ruhsat-lb-lerta-anim-alt-baslik {
    font-size: clamp(11px, 2.2vw, 14px);
    font-weight: 800;
    letter-spacing: 0.3px;
    color: rgba(255, 255, 255, 0.96);
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
    line-height: 1.2;
}
.ruhsat-lb-lerta-anim-alt-slogan {
    font-size: clamp(10px, 1.9vw, 12px);
    font-weight: 600;
    font-style: italic;
    color: rgba(255, 255, 255, 0.88);
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.2px;
}
.ruhsat-lb-lerta-anim-lerta {
    position: relative;
    z-index: 2;
    font-size: clamp(28px, 7vw, 44px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #fff;
    text-shadow:
        0 2px 0 rgba(0, 0, 0, 0.12),
        0 4px 24px rgba(0, 0, 0, 0.35),
        0 0 40px rgba(255, 255, 255, 0.15);
    animation: ruhsatLbLertaZoom 5s ease-in-out infinite;
    transform-origin: center center;
    will-change: transform, opacity;
}
.ruhsat-lb-lerta-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

@keyframes ruhsatLbLertaZoom {
    0%, 100% {
        opacity: 0;
        transform: scale(0.12);
        filter: blur(6px);
    }
    8% {
        opacity: 1;
        transform: scale(0.35);
        filter: blur(0);
    }
    42% {
        opacity: 1;
        transform: scale(1.85);
        filter: blur(0);
    }
    58%, 80% {
        opacity: 1;
        transform: scale(1.72);
    }
    92% {
        opacity: 0;
        transform: scale(2);
        filter: blur(4px);
    }
}

@keyframes ruhsatLbAltFade {
    0%, 32% {
        opacity: 0;
        transform: translateY(10px) scale(0.92);
    }
    46% {
        opacity: 0.45;
        transform: translateY(2px) scale(0.98);
    }
    58%, 80% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    92%, 100% {
        opacity: 0;
        transform: translateY(-6px) scale(1.03);
    }
}

@keyframes ruhsatLbBgPulse {
    0%, 100% {
        filter: brightness(1) saturate(1);
    }
    50% {
        filter: brightness(1.1) saturate(1.08);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ruhsat-lb-lerta-bg,
    .ruhsat-lb-lerta-anim-lerta,
    .ruhsat-lb-lerta-anim-alt {
        animation: none !important;
    }
    .ruhsat-lb-lerta-anim-lerta {
        opacity: 1;
        transform: scale(1.2);
        filter: none;
    }
    .ruhsat-lb-lerta-anim-alt {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 640px) {
    .ruhsat-lb-lerta-anim-alt {
        padding: 8px 12px;
    }
}
@media (max-width: 768px) {
    .ruhsat-leaderboard-afis-cerceve {
        min-height: 48px;
    }
}

/* Kaydet / Kapat alt çubuğu */
.ruhsat-form-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    padding: 10px 0 2px;
    border-top: 2px solid var(--ruhsat-accent-light);
    background: linear-gradient(180deg, color-mix(in srgb, var(--ruhsat-accent-light) 60%, transparent) 0%, transparent 100%);
}
.ruhsat-kaydet-btn {
    background: linear-gradient(180deg, var(--ruhsat-title-bg) 0%, var(--ruhsat-title-bg-end) 100%) !important;
    color: #fff !important;
    border: 1px solid var(--ruhsat-title-border) !important;
    padding: 9px 24px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 2px 6px rgba(107, 32, 48, 0.25);
    transition: transform 0.15s, box-shadow 0.15s;
}
.ruhsat-kaydet-btn:hover {
    background: linear-gradient(180deg, var(--ruhsat-field-border) 0%, var(--ruhsat-field-focus) 100%) !important;
    box-shadow: 0 3px 10px rgba(107, 32, 48, 0.32);
    transform: translateY(-1px);
}
.ruhsat-kapat-alt-btn {
    background: #fff !important;
    color: var(--ruhsat-accent) !important;
    border: 1px solid var(--ruhsat-accent-light) !important;
    padding: 9px 20px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 0.15s, border-color 0.15s;
}
.ruhsat-kapat-alt-btn:hover {
    background: color-mix(in srgb, var(--ruhsat-accent-light) 40%, #fff) !important;
    border-color: var(--ruhsat-field-border) !important;
}

/* Eski ruhsat.css çakışmalarını kaldır */
#ruhsat-modal .lerta-ruhsat-upload {
    border: none;
    padding: 0;
    margin-bottom: 0;
    background: transparent;
}

@media (max-width: 900px) {
    .ruhsat-modal-wrapper .pages-wrapper {
        grid-template-columns: 1fr;
    }
    .ruhsat-modal-wrapper .row-2col {
        flex-wrap: wrap;
    }
    .ruhsat-modal-wrapper .row-2col .col {
        flex: 1 1 100%;
    }
    .ruhsat-modal-wrapper .row-3col {
        flex-wrap: wrap;
    }
    .ruhsat-modal-wrapper .row-3col .col-50,
    .ruhsat-modal-wrapper .row-3col .col-25 {
        flex: 1 1 100%;
    }
}
@media (max-width: 768px) {
    #ruhsat-modal .modal-body.ruhsat-modal-body {
        padding: 8px;
    }
    .ruhsat-modal-wrapper .page {
        padding: 8px 9px;
    }
    .ruhsat-modal-wrapper .page-title {
        font-size: 10px;
    }
    .ruhsat-modal-wrapper .row-2col,
    .ruhsat-modal-wrapper .row-3col {
        gap: 4px;
        margin-bottom: 4px;
    }
    .ruhsat-modal-wrapper .field-group {
        min-height: 34px;
        padding: 2px 5px;
    }
    .ruhsat-modal-wrapper .field-group input,
    .ruhsat-modal-wrapper .field-group select,
    .ruhsat-modal-wrapper .field-group textarea {
        font-size: 12px;
    }
}

#ruhsat-modal .modal-header h3 {
    margin: 0;
    flex: 1;
    min-width: 0;
    font-size: 1.1rem;
    line-height: 1.3;
}
.ruhsat-header-sag {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.ruhsat-yonetim-video-trigger {
    flex-shrink: 0;
    display: block;
    padding: 0;
    border: none;
    background: none;
    cursor: pointer;
    line-height: 0;
}
.ruhsat-yonetim-video-trigger:hover .ruhsat-yonetim-video-thumb {
    box-shadow: 0 2px 8px rgba(0,0,0,0.28);
    transform: scale(1.05);
}
.ruhsat-yonetim-video-thumb {
    position: relative;
    display: block;
    width: 56px;
    height: 32px;
    border-radius: 5px;
    overflow: hidden;
    background: linear-gradient(135deg, #4c1d95 0%, #6f42c1 100%);
    box-shadow: 0 1px 4px rgba(0,0,0,0.22);
    transition: transform 0.2s, box-shadow 0.2s;
}
.ruhsat-yonetim-video-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.ruhsat-yonetim-video-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #4c1d95 0%, #6f42c1 100%);
}
.ruhsat-yonetim-video-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.3);
    color: white;
    font-size: 10px;
    transition: background 0.2s;
}
.ruhsat-yonetim-video-trigger:hover .ruhsat-yonetim-video-play {
    background: rgba(0,0,0,0.45);
}
.ruhsat-yonetim-video-play i { margin-left: 1px; }
#ruhsat-modal .close-btn {
    margin: 0;
    padding: 0;
    line-height: 1;
}
.ruhsat-yonetim-video-overlay {
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: rgba(0,0,0,0.72);
    /* Kapalıyken flex olmamalı — tüm sayfayı tıklanamaz yapardı */
    display: none;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.ruhsat-yonetim-video-popup {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    width: 100%;
    max-width: 900px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
}
.ruhsat-yonetim-video-popup-baslik {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #7a2438 0%, #4c1d95 100%);
    color: white;
    font-size: 14px;
    font-weight: 600;
}
.ruhsat-yonetim-video-kapat {
    background: rgba(255,255,255,0.2);
    border: none;
    color: white;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}
.ruhsat-yonetim-video-kapat:hover { background: rgba(255,255,255,0.35); }
.ruhsat-yonetim-video-embed {
    position: relative;
    width: 100%;
    background: #111;
}
.ruhsat-yonetim-video-embed--youtube {
    padding-bottom: 56.25%;
    height: 0;
}
.ruhsat-yonetim-video-embed--youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.ruhsat-yonetim-video-embed--rehber {
    padding: 0;
    height: auto;
}

/* Yerleşik kullanım rehberi oynatıcı */
.lerta-rehber-player {
    background: #0f172a;
}
.lerta-rehber-video {
    width: 100%;
    display: block;
    max-height: 56vh;
    background: #000;
    cursor: pointer;
}
.lerta-rehber-kontroller {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: linear-gradient(180deg, #1e293b, #0f172a);
    border-top: 1px solid rgba(255,255,255,0.08);
}
.lerta-rehber-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: linear-gradient(135deg, #9a3650, #7a2438);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    flex-shrink: 0;
    transition: transform 0.15s, box-shadow 0.15s;
}
.lerta-rehber-btn:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 12px rgba(122,36,56,0.45);
}
.lerta-rehber-btn--kucuk {
    width: 30px;
    height: 30px;
    font-size: 10px;
    background: rgba(255,255,255,0.12);
}
.lerta-rehber-ilerleme-wrap {
    flex: 1;
    position: relative;
    height: 6px;
    background: rgba(255,255,255,0.15);
    border-radius: 3px;
    overflow: hidden;
}
.lerta-rehber-ilerleme-dolgu {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #9a3650, #c084fc);
    border-radius: 3px;
    pointer-events: none;
    transition: width 0.1s linear;
}
.lerta-rehber-ilerleme {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}
.lerta-rehber-sure {
    font-size: 11px;
    color: #94a3b8;
    font-variant-numeric: tabular-nums;
    min-width: 72px;
    text-align: right;
    flex-shrink: 0;
}
.lerta-rehber-adimlar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 14px 14px;
    background: #0f172a;
    border-top: 1px solid rgba(255,255,255,0.06);
}
.lerta-rehber-adim {
    padding: 4px 10px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(255,255,255,0.06);
    color: #cbd5e1;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.lerta-rehber-adim:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}
.lerta-rehber-adim--aktif {
    background: linear-gradient(135deg, #7a2438, #6f42c1);
    border-color: transparent;
    color: #fff;
}
.lerta-rehber-bos {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
    padding: 24px;
    text-align: center;
    gap: 8px;
    min-height: 200px;
}
.lerta-rehber-bos i { font-size: 36px; opacity: 0.7; }
.lerta-rehber-bos p { margin: 0; font-size: 14px; }

.ruhsat-ocr-ust-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 0 10px 0;
    align-items: stretch;
}
.ruhsat-ocr-yukle {
    padding: 10px 12px;
    border: 2px solid var(--ruhsat-accent-light);
    border-radius: 8px;
    background: linear-gradient(160deg, var(--ruhsat-field-bg) 0%, color-mix(in srgb, var(--ruhsat-accent-light) 35%, #fff) 100%);
    min-width: 0;
}
.ruhsat-ocr-yukle-baslik {
    margin: 0 0 4px;
    color: var(--ruhsat-accent);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 6px;
}
.ruhsat-ocr-yukle-aciklama {
    margin: 0 0 8px;
    font-size: 10.5px;
    color: var(--ruhsat-label);
    line-height: 1.35;
}
.ruhsat-ocr-file-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
.ruhsat-ocr-dropzone {
    position: relative;
    border: 2px dashed var(--ruhsat-accent-light);
    border-radius: 8px;
    background: #fff;
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
    overflow: hidden;
    margin-bottom: 10px;
}
.ruhsat-ocr-dropzone:hover,
.ruhsat-ocr-dropzone.ruhsat-ocr-dropzone--surukle {
    border-color: var(--ruhsat-field-border);
    background: var(--ruhsat-field-bg);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ruhsat-field-border) 10%, transparent);
}
.ruhsat-ocr-dropzone-icerik {
    text-align: center;
    padding: 16px 12px;
    color: #9ca3af;
    pointer-events: none;
}
.ruhsat-ocr-dropzone-icerik i {
    font-size: 24px;
    color: var(--ruhsat-field-border);
    display: block;
    margin-bottom: 8px;
}
.ruhsat-ocr-dropzone-icerik strong {
    display: block;
    font-size: 13px;
    color: #374151;
    margin-bottom: 4px;
}
.ruhsat-ocr-dropzone-icerik span {
    font-size: 11px;
    color: #9ca3af;
}
#ruhsatOnizlemeModal {
    display: none;
    max-width: 100%;
    max-height: 160px;
    width: auto;
    height: auto;
    border-radius: 8px;
    object-fit: contain;
}
.ruhsat-ocr-aksiyonlar {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ruhsat-ocr-sec-btn {
    flex: 1;
    min-width: 120px;
    background: #fff;
    color: var(--ruhsat-accent);
    border: 1px solid var(--ruhsat-accent-light);
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.ruhsat-ocr-sec-btn:hover {
    background: color-mix(in srgb, var(--ruhsat-accent-light) 30%, #fff);
    border-color: var(--ruhsat-field-border);
}
.ruhsat-ocr-oku-btn {
    flex: 1;
    min-width: 140px;
    background: linear-gradient(180deg, var(--ruhsat-title-bg) 0%, var(--ruhsat-title-bg-end) 100%);
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.ruhsat-ocr-oku-btn:hover { background: linear-gradient(180deg, var(--ruhsat-field-border) 0%, var(--ruhsat-field-focus) 100%); }
.ruhsat-ocr-oku-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}
.lerta-ocr-durum {
    margin: 8px 0 0;
    font-size: 12px;
    color: #6b7280;
    min-height: 1.2em;
    line-height: 1.45;
}
.lerta-ocr-durum--uyari {
    color: #b45309;
    font-weight: 600;
}
.lerta-ocr-durum--hata {
    color: #dc2626;
    font-weight: 600;
}
.lerta-ocr-durum--ok {
    color: #059669;
    font-weight: 600;
}
.ruhsat-ocr-reklam {
    border: 2px solid var(--ruhsat-accent-light);
    border-radius: 8px;
    background: linear-gradient(160deg, var(--ruhsat-field-focus) 0%, var(--ruhsat-title-bg-end) 55%, var(--ruhsat-title-bg) 100%);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}
.ruhsat-ocr-reklam-baslik {
    font-size: 11px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    flex-shrink: 0;
}
.ruhsat-ocr-reklam-anim-cerceve {
    flex: 1;
    min-height: 150px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}
.ruhsat-lb-lerta--ocr-panel {
    min-height: 150px;
    height: 100%;
}
.ruhsat-lb-lerta--ocr-panel .ruhsat-lb-lerta-anim-lerta {
    font-size: clamp(34px, 9vw, 56px);
}
.ruhsat-lb-lerta--ocr-panel .ruhsat-lb-lerta-anim-alt-baslik {
    font-size: clamp(12px, 2.5vw, 16px);
}
.ruhsat-lb-lerta--ocr-panel .ruhsat-lb-lerta-anim-alt-slogan {
    font-size: clamp(11px, 2.2vw, 14px);
}
.ruhsat-ocr-reklam-alt {
    margin-top: 8px;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.35;
    text-align: center;
    flex-shrink: 0;
}
@media (max-width: 768px) {
    .ruhsat-ocr-ust-grid {
        grid-template-columns: 1fr;
    }
    .ruhsat-ocr-dropzone {
        min-height: 120px;
    }
}