@charset "UTF-8";
/* GBS Kurumsal Responsive Tasarım - ASP.NET Web Forms + DevExpress 14.2 */
:root {
    color-scheme: light;
    --gov-navy: #0B1F3A;
    --gov-navy-2: #102E56;
    --gov-blue: #0D5EA6;
    --gov-blue-2: #1B75BB;
    --gov-red: #C62828;
    --gov-green: #16794C;
    --gov-orange: #B45309;
    --text: #172033;
    --text-soft: #475569;
    --text-muted: #667085;
    --surface: #F5F7FA;
    --surface-2: #EEF3F8;
    --white: #FFFFFF;
    --border: #D9E2EC;
    --border-strong: #B9C7D8;
    --info-bg: #EAF4FF;
    --info-border: #B8DDFB;
    --success-bg: #ECFDF3;
    --success-border: #ABEFC6;
    --danger-bg: #FEF3F2;
    --danger-border: #FDA29B;
    --warning-bg: #FFF8E6;
    --warning-border: #F2D27A;
    --radius-sm: 10px;
    --radius: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --shadow-sm: 0 1px 2px rgba(16,24,40,.06);
    --shadow-md: 0 12px 28px rgba(11,31,58,.10);
    --shadow-lg: 0 22px 64px rgba(11,31,58,.16);
    --font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Noto Sans","Helvetica Neue",sans-serif;
    --header-h: 72px;
    --sidebar-w: 286px;
}

*, *::before, *::after {
    box-sizing: border-box
}

html {
    min-height: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: var(--font);
    color: var(--text);
    background: radial-gradient(circle at 8% 0%,rgba(13,94,166,.10),transparent 26rem),linear-gradient(180deg,#F8FAFC 0%,var(--surface) 100%);
    line-height: 1.5;
    text-rendering: optimizeLegibility
}

a {
    color: var(--gov-blue);
    text-decoration: none
}

    a:hover {
        text-decoration: underline;
        color: var(--gov-navy)
    }

img {
    max-width: 100%;
    height: auto
}

svg {
    display: inline-block;
    vertical-align: middle;
    overflow: visible
}

button, input, select, textarea {
    font: inherit
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0
}


/* MASTER LAYOUT / SIDEBAR MENU FIX
   Bu blok, sablon.Master içindeki menü ve header SVG ikonlarının sayfa genişliğinde görünmesini engeller. */
.skip-link {
    position: absolute;
    left: 16px;
    top: -60px;
    z-index: 9999;
    padding: 10px 14px;
    border-radius: var(--radius-sm);
    background: var(--gov-red);
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    transition: top .15s ease
}

    .skip-link:focus {
        top: 12px;
        outline: 3px solid rgba(255,255,255,.7)
    }

.top-service-bar {
    min-height: 34px;
    display: flex;
    align-items: center;
    padding: 0 clamp(16px,3vw,40px);
    background: var(--gov-navy);
    color: rgba(255,255,255,.82);
    font-size: 12px;
    letter-spacing: .01em
}

    .top-service-bar strong {
        color: #fff;
        font-weight: 800
    }

    .top-service-bar .service-right {
        margin-left: auto;
        display: flex;
        gap: 18px;
        align-items: center
    }

    .top-service-bar .service-pill {
        min-height: 22px;
        display: inline-flex;
        align-items: center;
        padding: 2px 9px;
        border: 1px solid rgba(255,255,255,.20);
        border-radius: 999px;
        background: rgba(255,255,255,.06);
        color: #fff;
        white-space: nowrap
    }

.site-header {
    position: sticky;
    top: 0;
    z-index: 120;
    min-height: var(--header-h);
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 clamp(16px,3vw,40px);
    background: rgba(255,255,255,.96);
    backdrop-filter: saturate(140%) blur(12px);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-sm)
}

.header-logo {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    color: var(--text);
    text-decoration: none
}

    .header-logo:hover {
        text-decoration: none;
        color: var(--text)
    }

.header-logo-mark {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: linear-gradient(145deg,var(--gov-navy),var(--gov-blue));
    box-shadow: 0 8px 20px rgba(11,31,58,.18);
    overflow: hidden;
    flex: 0 0 46px
}

    .header-logo-mark img {
        width: 34px !important;
        height: 34px !important;
        object-fit: contain;
        filter: brightness(0) invert(1);
        opacity: .94
    }

.header-brand {
    min-width: 0
}

.header-brand-name {
    display: block;
    color: var(--gov-navy);
    font-size: 16px;
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.header-brand-sub {
    display: block;
    margin-top: 3px;
    color: var(--text-soft);
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.header-spacer {
    flex: 1
}

.mobile-toggle {
    display: none;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
    color: var(--gov-navy);
    cursor: pointer;
    flex: 0 0 44px
}

    .mobile-toggle:hover {
        background: var(--surface-2);
        border-color: var(--border-strong)
    }

    .mobile-toggle svg {
        width: 22px !important;
        height: 22px !important;
        max-width: 22px !important;
        flex: 0 0 22px !important
    }

.header-user {
    display: inline-flex;
    align-items: center;
    gap: 12px
}

.user-card {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 4px 8px 4px 4px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: #fff;
    text-decoration: none;
    color: var(--text)
}

    .user-card:hover {
        text-decoration: none;
        color: var(--text);
        background: #F9FBFD
    }

.user-avatar {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px var(--border-strong);
    background: var(--surface-2)
}

.user-meta {
    display: flex;
    flex-direction: column;
    padding-right: 6px
}

    .user-meta strong {
        font-size: 12px;
        line-height: 1.1;
        color: var(--gov-navy)
    }

    .user-meta span {
        font-size: 11px;
        color: var(--text-muted)
    }

.btn-logout, .btn-logout table {
    min-height: 40px !important;
    border-radius: 999px !important
}

.btn-logout {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 16px !important;
    border: 1px solid rgba(198,40,40,.22) !important;
    background: #fff !important;
    color: var(--danger) !important;
    font-weight: 800 !important;
    box-shadow: none !important
}

    .btn-logout:hover {
        background: var(--danger-bg) !important;
        text-decoration: none !important
    }

.sidebar-overlay {
    display: none
}

.app-shell {
    display: grid;
    grid-template-columns: var(--sidebar-w) minmax(0,1fr);
    min-height: calc(100vh - var(--header-h) - 34px)
}

.sidebar {
    position: sticky;
    top: calc(var(--header-h) + 34px);
    align-self: start;
    height: calc(100vh - var(--header-h) - 34px);
    padding: 24px 18px;
    border-right: 1px solid var(--border);
    background: rgba(255,255,255,.72);
    overflow-y: auto
}

.sidebar-card {
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.92);
    box-shadow: var(--shadow-sm)
}

.sidebar-intro {
    padding: 12px 12px 16px;
    border-bottom: 1px solid var(--border)
}

    .sidebar-intro strong {
        display: block;
        color: var(--gov-navy);
        font-size: 14px;
        font-weight: 900
    }

    .sidebar-intro span {
        display: block;
        margin-top: 4px;
        color: var(--text-muted);
        font-size: 12px;
        line-height: 1.45
    }

.sidebar-nav {
    padding-top: 12px
}

.nav-section-label {
    display: block;
    padding: 12px 10px 6px;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase
}

.nav-link {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 42px;
    padding: 10px 11px;
    border-radius: 13px;
    color: var(--text-soft) !important;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none !important;
    line-height: 1.25;
    transition: background .15s ease,color .15s ease,transform .15s ease
}

    .nav-link:hover {
        background: var(--surface-2);
        color: var(--gov-navy) !important;
        text-decoration: none !important;
        transform: translateX(2px)
    }

    .nav-link.active {
        background: linear-gradient(135deg,rgba(13,94,166,.12),rgba(13,94,166,.04));
        color: var(--gov-navy) !important;
        box-shadow: inset 3px 0 0 var(--gov-blue)
    }

    .nav-icon, .nav-link > svg, .sidebar .nav-link svg, .sidebar-nav .nav-link svg {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        max-width: 18px !important;
        max-height: 18px !important;
        flex: 0 0 18px !important;
        display: inline-block !important;
        vertical-align: middle !important;
        overflow: visible !important
    }

        .nav-icon path, .nav-icon line, .nav-icon rect, .nav-icon circle, .nav-icon polyline, .nav-link svg path, .nav-link svg line, .nav-link svg rect, .nav-link svg circle, .nav-link svg polyline {
            vector-effect: non-scaling-stroke
        }

.sidebar-footer-note {
    margin-top: 16px;
    padding: 12px;
    border: 1px dashed var(--border-strong);
    border-radius: var(--radius-sm);
    color: var(--text-muted);
    font-size: 11px;
    line-height: 1.5;
    background: #fff
}

.main-content {
    min-width: 0;
    padding: clamp(22px,3vw,38px)
}

.content-container {
    width: min(100%,1180px)
}

.site-footer {
    border-top: 1px solid var(--border);
    background: rgba(255,255,255,.90);
    color: var(--text-muted);
    font-size: 12px
}

.footer-inner {
    width: min(100%,1400px);
    margin: 0 auto;
    padding: 16px clamp(16px,3vw,40px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px
}

@media(max-width:1060px) {
    .mobile-toggle {
        display: inline-flex
    }

    .header-user .user-meta {
        display: none
    }

    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 220;
        width: min(88vw,var(--sidebar-w));
        height: 100vh;
        transform: translateX(-105%);
        transition: transform .18s ease;
        background: #fff;
        box-shadow: var(--shadow-lg)
    }

        .sidebar.open {
            transform: translateX(0)
        }

    .sidebar-overlay.open {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 210;
        background: rgba(11,31,58,.34)
    }

    .app-shell {
        display: block;
        min-height: calc(100vh - var(--header-h) - 34px)
    }

    .main-content {
        padding: 20px 16px 32px
    }

    .content-container {
        width: 100%
    }
}

@media(max-width:640px) {
    .top-service-bar {
        height: auto;
        min-height: 30px;
        padding-block: 6px
    }

        .top-service-bar .service-right {
            display: none
        }

    .site-header {
        gap: 10px;
        padding-inline: 12px
    }

    .header-logo-mark {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        flex-basis: 42px
    }

        .header-logo-mark img {
            width: 30px !important;
            height: 30px !important
        }

    .header-brand-sub {
        display: none
    }

    .btn-logout {
        padding-inline: 12px !important
    }

    .footer-inner {
        flex-direction: column;
        align-items: flex-start
    }
}

/* Generic page building blocks */
.gbs-app-page {
    width: min(100%,1180px);
    padding: 0 0 32px
}

.page-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 18px
}

.page-title {
    margin: 0;
    color: var(--gov-navy);
    font-size: clamp(26px,3vw,36px);
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -.035em
}

.page-subtitle, .page-breadcrumb {
    margin: 6px 0 0;
    color: var(--text-muted);
    font-size: 13px;
    font-weight: 700
}

.page-lead {
    margin: 12px 0 0;
    max-width: 760px;
    color: var(--text-soft);
    font-size: 15px;
    line-height: 1.75
}

.page-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap
}

.modern-card, .card {
    margin-bottom: 22px;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.98);
    box-shadow: var(--shadow-sm);
    overflow: hidden
}

.card-header, .modern-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg,#fff 0%,#F9FBFD 100%)
}

.card-header-icon, .section-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid #CFE8FF;
    border-radius: 12px;
    background: #EDF6FF;
    color: var(--gov-blue)
}

    .card-header-icon svg, .section-icon svg {
        width: 18px;
        height: 18px
    }

.card-header-title, .section-title {
    color: var(--gov-navy);
    font-size: 16px;
    font-weight: 900
}

.card-body, .modern-card-body {
    padding: clamp(18px,2.4vw,28px)
}

.alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 13px 15px;
    border-radius: 14px;
    font-size: 13px;
    line-height: 1.65
}

.alert-danger {
    border: 1px solid var(--danger-border);
    background: var(--danger-bg);
    color: #991B1B
}

.alert-info {
    border: 1px solid var(--info-border);
    background: var(--info-bg);
    color: var(--gov-navy)
}

.alert-warning {
    border: 1px solid var(--warning-border);
    background: var(--warning-bg);
    color: #7A4B00
}

.alert-success {
    border: 1px solid var(--success-border);
    background: var(--success-bg);
    color: #166534
}

.muted-note {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1.6
}

.text-danger {
    color: var(--gov-red) !important
}

.text-success {
    color: var(--gov-green) !important
}

.hidden-soft {
    display: none
}
/* Forms */
.modern-form {
    display: flex;
    flex-direction: column;
    gap: 18px
}

.form-section {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: #fff;
    overflow: hidden
}

.form-section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    background: #F9FBFD
}

.form-section-title {
    color: var(--gov-navy);
    font-size: 15px;
    font-weight: 900
}

.form-section-body {
    padding: 18px
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 16px 22px
}

.form-row {
    display: grid;
    grid-template-columns: 190px minmax(0,1fr);
    gap: 14px;
    align-items: start
}

.form-row-full {
    grid-column: 1/-1
}

.form-row-stacked {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.form-label, .field-label {
    padding-top: 8px;
    color: #344054;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.4
}

    .form-label small, .label-help {
        display: block;
        margin-top: 4px;
        color: var(--text-muted);
        font-size: 11px;
        font-weight: 600;
        line-height: 1.45
    }

.form-control, .field-control {
    min-width: 0
}

.form-control-stack {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border)
}

.form-actions-left {
    justify-content: flex-start
}

.inline-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap
}

.recaptcha-scale {
    display: inline-block;
    transform: scale(.78);
    transform-origin: left top;
    margin-bottom: -18px
}

.declaration-box {
    max-width: 720px;
    padding: 14px 16px;
    border: 1px solid var(--warning-border);
    border-radius: 14px;
    background: var(--warning-bg);
    color: #7A4B00;
    font-size: 13px;
    line-height: 1.65
}

.section-divider {
    height: 1px;
    background: var(--border);
    margin: 8px 0
}
/* DevExpress 14.2 compatible sizing */
.gbs-field, .gbs-field table, .gbs-field-wide, .gbs-field-wide table, .dx-field, .dx-field table {
    width: 100% !important
}

.gbs-field {
    max-width: 420px
}

.gbs-field-wide {
    max-width: 560px
}

.gbs-field-small {
    max-width: 220px
}

.gbs-field-medium {
    max-width: 340px
}

.gbs-app-page .dxeTextBox_Aqua, .gbs-app-page .dxeButtonEdit_Aqua, .gbs-app-page .dxeComboBox_Aqua, .gbs-app-page .dxeTextBox_Moderno, .gbs-app-page .dxeButtonEdit_Moderno, .gbs-app-page .dxeComboBox_Moderno, .gbs-auth .dxeTextBox_Aqua, .gbs-auth .dxeButtonEdit_Aqua, .gbs-auth .dxeComboBox_Aqua, .gbs-auth .dxeTextBox_Moderno, .gbs-auth .dxeButtonEdit_Moderno, .gbs-auth .dxeComboBox_Moderno {
    border: 1px solid var(--border-strong) !important;
    border-radius: 10px !important;
    background: #fff !important;
    min-height: 36px !important;
    box-shadow: none !important;
    overflow: hidden !important
}

.gbs-app-page input.dxeEditArea_Aqua, .gbs-app-page input.dxeEditArea_Moderno, .gbs-auth input.dxeEditArea_Aqua, .gbs-auth input.dxeEditArea_Moderno, .gbs-app-page textarea.dxeEditArea_Aqua, .gbs-auth textarea.dxeEditArea_Aqua {
    min-height: 34px !important;
    padding: 0 10px !important;
    color: var(--text) !important;
    font: 13px var(--font) !important;
    background: transparent !important
}

.gbs-app-page .dxeFocused_Aqua, .gbs-app-page .dxeFocused_Moderno, .gbs-auth .dxeFocused_Aqua, .gbs-auth .dxeFocused_Moderno {
    border-color: var(--gov-blue) !important;
    box-shadow: 0 0 0 3px rgba(13,94,166,.14) !important
}

.gbs-app-page .dxeDisabled_Aqua, .gbs-app-page .dxeDisabled_Moderno {
    background: #F8FAFC !important;
    color: var(--text-muted) !important
}

.gbs-app-page .dxbButton, .gbs-app-page .dxbButton_Aqua, .gbs-app-page .dxbButton_Moderno, .gbs-auth .dxbButton, .gbs-auth .dxbButton_Aqua, .gbs-auth .dxbButton_Moderno {
    border-radius: 10px !important;
    border: 1px solid var(--gov-blue) !important;
    background: linear-gradient(180deg,var(--gov-blue-2),var(--gov-blue)) !important;
    color: #fff !important;
    font-weight: 850 !important;
    box-shadow: 0 8px 16px rgba(13,94,166,.15) !important
}

    .gbs-app-page .dxbButton:hover, .gbs-auth .dxbButton:hover {
        filter: brightness(.98);
        transform: translateY(-1px)
    }

.plain-button, input[type="submit"], input[type="button"] {
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--gov-blue);
    border-radius: 10px;
    background: linear-gradient(180deg,var(--gov-blue-2),var(--gov-blue));
    color: #fff;
    font-weight: 850;
    cursor: pointer
}

    .plain-button.secondary {
        border-color: var(--border-strong);
        background: #fff;
        color: var(--gov-navy);
        box-shadow: none
    }

.dx-grid-wrap {
    width: 100%;
    overflow: auto;
    border-radius: 16px
}

.gbs-app-page .dxgvControl_Aqua, .gbs-app-page .dxgvControl_Moderno, .gbs-app-page .dxgvControl_Glass {
    width: 100% !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-sm)
}

.gbs-app-page .dxgvHeader_Aqua, .gbs-app-page .dxgvHeader_Moderno, .gbs-app-page .dxgvHeader_Glass {
    background: #F1F6FC !important;
    color: var(--gov-navy) !important;
    font-weight: 850 !important
}

.gbs-app-page .dxgvDataRow_Aqua td, .gbs-app-page .dxgvDataRow_Moderno td, .gbs-app-page .dxgvDataRow_Glass td {
    font-size: 13px !important
}

.gbs-app-page .dxeListBox_Aqua, .gbs-app-page .dxeListBox_Moderno {
    border-radius: 14px !important;
    overflow: hidden !important
}

.validation-message, span[style*="color:Red"], span[style*="color: red"], .validation-summary-errors {
    color: var(--gov-red) !important;
    font-size: 12px;
    font-weight: 700
}

.dx-link {
    font-weight: 800;
    color: var(--gov-blue)
}
/* Public/auth pages */
.gbs-auth {
    min-height: 100vh;
    background: radial-gradient(circle at 10% 12%,rgba(255,255,255,.16),transparent 18rem),linear-gradient(135deg,var(--gov-navy) 0%,var(--gov-blue) 48%,#F3F6FA 48%,#F3F6FA 100%)
}

.auth-shell {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(16px,3vw,34px)
}

.login-panel {
    width: min(100%,1050px);
    display: grid;
    grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr);
    border: 1px solid rgba(255,255,255,.32);
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--shadow-lg);
    overflow: hidden
}

.login-brand {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 560px;
    padding: clamp(34px,5vw,58px) clamp(24px,4vw,44px);
    background: linear-gradient(180deg,var(--gov-navy),var(--gov-navy-2));
    color: #fff
}

    .login-brand::after {
        content: "";
        position: absolute;
        right: -80px;
        bottom: -80px;
        width: 240px;
        height: 240px;
        border-radius: 50%;
        background: rgba(255,255,255,.08)
    }

.login-logo {
    position: relative;
    z-index: 1;
    display: block;
    width: min(100%,280px);
    margin: 0 auto 28px
}

.login-brand h1 {
    position: relative;
    z-index: 1;
    margin: 0 0 16px;
    text-align: center;
    font-size: clamp(25px,3vw,35px);
    line-height: 1.22;
    font-weight: 900;
    letter-spacing: -.03em
}

.login-brand p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: rgba(255,255,255,.88);
    font-size: 15px;
    line-height: 1.8
}

.login-features {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 28px
}

.login-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 750
}

    .login-feature::before {
        content: "✓";
        display: inline-flex;
        width: 22px;
        height: 22px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: rgba(157,214,255,.16);
        color: #9DD6FF;
        font-weight: 900
    }

.login-form-pane {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(34px,5vw,58px) clamp(24px,4vw,46px)
}

.auth-card {
    width: 100%;
    max-width: 430px
}

.auth-title {
    margin: 0 0 8px;
    color: var(--gov-navy);
    font-size: clamp(25px,3vw,31px);
    line-height: 1.12;
    font-weight: 900;
    letter-spacing: -.03em
}

.auth-subtitle {
    margin: 0 0 28px;
    color: var(--text-muted);
    font-size: 15px
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 18px
}

.auth-field {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.auth-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
    text-align: center
}

.auth-footer {
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    color: #98A2B3;
    text-align: center;
    font-size: 12px
}

.public-card-shell {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(18px,4vw,54px);
    background: radial-gradient(circle at top left,rgba(13,94,166,.10),transparent 34rem),linear-gradient(180deg,#F8FAFC 0%,var(--surface) 100%)
}

.public-card {
    width: min(100%,580px);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    background: #fff;
    box-shadow: var(--shadow-lg);
    overflow: hidden
}

.public-card-stripe {
    height: 7px;
    background: linear-gradient(90deg,var(--gov-red),var(--gov-blue))
}

.public-card-body {
    padding: clamp(24px,4vw,38px)
}

.public-logo {
    display: block;
    max-width: 320px;
    margin: 0 auto 24px
}

.status-message {
    font-size: 18px;
    font-weight: 850;
    color: var(--gov-navy);
    text-align: center;
    margin: 14px 0 24px
}
/* Contact */
.contact-showcase .card-body {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.contact-hero {
    position: relative;
    padding: 26px;
    border: 1px solid var(--border);
    border-radius: 22px;
    background: radial-gradient(circle at top right,rgba(13,94,166,.12),transparent 18rem),linear-gradient(135deg,#F8FBFF 0%,#FFFFFF 52%,#F5F8FC 100%)
}

.contact-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 11px;
    border: 1px solid #CFE0F5;
    border-radius: 999px;
    background: #fff;
    color: var(--gov-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase
}

.contact-heading {
    margin: 12px 0 9px;
    color: var(--gov-navy);
    font-size: clamp(22px,2.6vw,30px);
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -.03em
}

.contact-description {
    margin: 0;
    max-width: 760px;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.75
}

.contact-layout {
    display: grid;
    grid-template-columns: minmax(310px,410px) minmax(0,1fr);
    gap: 22px;
    align-items: stretch
}

.contact-info-panel, .map-panel {
    border: 1px solid var(--border);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--shadow-sm)
}

.contact-info-panel {
    padding: 20px
}

.info-tile-grid {
    display: grid;
    gap: 13px
}

.info-tile {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 12px;
    align-items: start;
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: linear-gradient(180deg,#fff 0%,#FBFDFF 100%)
}

.info-tile-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #D5E7FA;
    border-radius: 14px;
    background: #EEF6FF;
    color: var(--gov-blue)
}

    .info-tile-icon svg {
        width: 17px !important;
        height: 17px !important
    }

.info-tile-label {
    display: block;
    margin-bottom: 5px;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase
}

.info-tile-value {
    display: inline-block;
    color: var(--gov-navy);
    font-size: 15px;
    line-height: 1.35;
    font-weight: 900;
    word-break: break-word
}

.info-tile-note {
    margin: 7px 0 0;
    color: var(--text-soft);
    font-size: 12px;
    line-height: 1.6
}

.location-action-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px
}

.location-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 13px;
    border: 1px solid var(--border-strong);
    border-radius: 12px;
    background: #fff;
    color: var(--gov-navy);
    font-size: 13px;
    font-weight: 850
}

    .location-action-btn svg {
        width: 16px !important;
        height: 16px !important
    }

.location-action-primary {
    border-color: var(--gov-blue);
    background: linear-gradient(180deg,var(--gov-blue-2),var(--gov-blue));
    color: #fff;
    box-shadow: 0 10px 18px rgba(13,94,166,.16)
}

    .location-action-primary:hover {
        color: #fff;
        text-decoration: none
    }

.map-panel {
    display: flex;
    flex-direction: column;
    overflow: hidden
}

.map-frame-wrap {
    position: relative;
    min-height: 390px;
    background: #EAF4FF
}

.map-frame {
    width: 100%;
    height: 100%;
    min-height: 390px;
    border: 0;
    display: block
}

.map-panel-footer {
    padding: 14px 17px;
    border-top: 1px solid var(--border);
    background: linear-gradient(180deg,#fff 0%,#F9FBFD 100%)
}

    .map-panel-footer strong {
        display: block;
        color: var(--gov-navy);
        font-size: 13px;
        font-weight: 900
    }

    .map-panel-footer span {
        display: block;
        margin-top: 3px;
        color: var(--text-soft);
        font-size: 12px;
        line-height: 1.55
    }
/* Assignment pages */
.selector-card {
    display: grid;
    grid-template-columns: 180px minmax(0,1fr);
    gap: 14px;
    align-items: center
}

.assignment-summary {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 14px
}

.summary-item {
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #F9FBFD
}

.summary-label {
    display: block;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase
}

.summary-value {
    display: block;
    margin-top: 5px;
    color: var(--gov-navy);
    font-size: 15px;
    font-weight: 850;
    line-height: 1.5
}

.summary-item-wide {
    grid-column: 1/-1
}

.assignment-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 360px
}

.popup-content {
    font-size: 13px;
    line-height: 1.7;
    text-align: left;
    color: var(--text)
}

.popup-consent {
    display: flex;
    justify-content: center;
    margin-top: 14px
}

.matrah-panel {
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #F9FBFD;
    text-align: center
}

.matrah-input-row {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 12px;
    align-items: center;
    margin: 12px 0
}

.duty-options {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(210px,1fr));
    gap: 10px;
    margin-top: 12px
}

.duty-option {
    padding: 11px 13px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: #fff
}

.transfer-layout {
    display: grid;
    grid-template-columns: minmax(0,1fr) 150px minmax(0,1fr);
    gap: 14px;
    align-items: start
}

.transfer-title {
    margin: 0 0 8px;
    color: var(--gov-navy);
    font-size: 13px;
    font-weight: 900
}

.transfer-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 28px
}

.transfer-hint {
    text-align: center;
    color: var(--text-muted);
    font-size: 12px
}

.preference-warning {
    margin-top: 14px;
    padding: 13px 15px;
    border: 1px solid var(--danger-border);
    border-radius: 14px;
    background: var(--danger-bg);
    color: #991B1B;
    font-size: 13px;
    text-align: center
}

.save-row {
    text-align: center;
    margin-top: 18px
}

.history-intro {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid var(--info-border);
    border-radius: 16px;
    background: var(--info-bg);
    color: var(--gov-navy)
}

    .history-intro svg {
        width: 24px;
        height: 24px;
        flex: 0 0 auto
    }
/* Password rules */
.password-rules {
    max-width: 620px;
    margin-top: 10px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: #F9FBFD
}

.password-rules-title {
    display: block;
    margin-bottom: 8px;
    color: var(--gov-navy);
    font-size: 13px;
    font-weight: 900
}

.password-rule-list {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px 12px;
    margin: 0;
    padding: 0;
    list-style: none
}

.password-rule {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--gov-red);
    font-size: 12px;
    font-weight: 750
}

    .password-rule::before {
        content: "✕";
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: var(--danger-bg);
        color: var(--gov-red);
        font-size: 11px;
        font-weight: 900
    }

    .password-rule.valid {
        color: var(--gov-green)
    }

        .password-rule.valid::before {
            content: "✓";
            background: var(--success-bg);
            color: var(--gov-green)
        }
/* Photo */
.photo-layout {
    display: grid;
    grid-template-columns: 140px minmax(0,1fr);
    gap: 16px;
    align-items: start
}

.profile-photo {
    width: 120px !important;
    height: 160px !important;
    object-fit: cover;
    border: 1px solid var(--border-strong);
    border-radius: 14px;
    background: #F8FAFC;
    box-shadow: var(--shadow-sm)
}

.photo-help {
    margin-top: 12px;
    padding: 14px 16px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #F9FBFD
}

    .photo-help ol {
        margin: 0 0 12px;
        padding-left: 20px;
        color: var(--text-soft);
        font-size: 13px;
        line-height: 1.65
    }

    .photo-help img {
        border-radius: 12px;
        margin: 8px 0;
        max-width: 100%;
        height: auto
    }

.file-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap
}

    .file-actions input[type="file"] {
        max-width: 100%;
        padding: 8px;
        border: 1px dashed var(--border-strong);
        border-radius: 12px;
        background: #fff
    }

@media (max-width:980px) {
    .form-grid, .assignment-summary, .contact-layout {
        grid-template-columns: 1fr
    }

    .selector-card {
        grid-template-columns: 1fr
    }

    .transfer-layout {
        grid-template-columns: 1fr
    }

    .transfer-buttons {
        flex-direction: row;
        justify-content: center;
        padding-top: 0;
        flex-wrap: wrap
    }

    .login-panel {
        grid-template-columns: 1fr;
        max-width: 570px
    }

    .login-brand {
        min-height: auto;
        text-align: center
    }

    .login-features {
        align-items: center
    }

    .page-hero {
        flex-direction: column
    }

    .matrah-input-row {
        grid-template-columns: 1fr
    }

    .password-rule-list {
        grid-template-columns: 1fr
    }
}

@media (max-width:680px) {
    .gbs-app-page {
        padding-bottom: 20px
    }

    .card-header, .modern-card-header {
        padding: 14px 15px
    }

    .card-body, .modern-card-body, .form-section-body {
        padding: 15px
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 6px
    }

    .form-label, .field-label {
        padding-top: 0
    }

    .form-actions {
        justify-content: stretch;
        flex-direction: column
    }

        .form-actions .dxbButton, .form-actions input[type="submit"], .form-actions input[type="button"] {
            width: 100% !important
        }

    .recaptcha-scale {
        transform: scale(.86);
        margin-bottom: -8px
    }

    .photo-layout {
        grid-template-columns: 1fr
    }

    .contact-hero, .contact-info-panel {
        padding: 16px
    }

    .info-tile {
        grid-template-columns: 38px 1fr
    }

    .info-tile-icon {
        width: 38px;
        height: 38px
    }

    .location-action-bar {
        flex-direction: column
    }

    .location-action-btn {
        width: 100%
    }

    .map-frame-wrap, .map-frame {
        min-height: 300px
    }

    .auth-shell, .public-card-shell {
        padding: 14px
    }

    .login-brand, .login-form-pane, .public-card-body {
        padding: 24px 18px
    }

    .login-logo, .public-logo {
        max-width: 240px
    }
}

@media (prefers-reduced-motion:reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important
    }
}


/* V13 FIX - LEFT SIDEBAR + SINGLE-COLUMN FORMS
   - --header-h and --sidebar-w variables are required by app-shell/sidebar.
   - All manual form grids are forced to one column; label and control are stacked vertically.
*/
:root {
    --header-h: 72px;
    --sidebar-w: 286px;
}

/* Desktop layout: left sidebar, content on right */
.gbs-app .app-shell {
    display: grid !important;
    grid-template-columns: 286px minmax(0,1fr) !important;
    grid-template-columns: var(--sidebar-w,286px) minmax(0,1fr) !important;
    align-items: start !important;
    min-height: calc(100vh - 106px) !important;
    min-height: calc(100vh - var(--header-h,72px) - 34px) !important;
}

.gbs-app .sidebar {
    position: sticky !important;
    top: 106px !important;
    top: calc(var(--header-h,72px) + 34px) !important;
    width: 286px !important;
    width: var(--sidebar-w,286px) !important;
    height: calc(100vh - 106px) !important;
    height: calc(100vh - var(--header-h,72px) - 34px) !important;
    min-height: calc(100vh - 106px) !important;
    align-self: start !important;
    overflow-y: auto !important;
    border-right: 1px solid var(--border) !important;
    background: rgba(255,255,255,.78) !important;
}

.gbs-app .main-content {
    min-width: 0 !important;
    width: 100% !important;
    padding: clamp(22px,3vw,38px) !important;
}

.gbs-app .content-container {
    width: min(100%,1180px) !important;
}

/* Keep sidebar icons small and aligned */
.gbs-app .nav-icon,
.gbs-app .nav-link > svg,
.gbs-app .sidebar .nav-link svg,
.gbs-app .sidebar-nav .nav-link svg {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
    flex: 0 0 18px !important;
    display: inline-block !important;
}

.gbs-app .mobile-toggle > svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
}

/* Form layout: no side-by-side form fields on wide screens */
.gbs-app .modern-form,
.gbs-app .form-section-body {
    width: 100% !important;
}

.gbs-app .form-grid,
.gbs-app .profile-grid,
.gbs-app .application-grid,
.gbs-app .password-grid,
.gbs-app .field-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
}

.gbs-app .form-row,
.gbs-app .form-row-full,
.gbs-app .field-row,
.gbs-app .profile-row,
.gbs-app .application-row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 720px !important;
}

.gbs-app .form-label,
.gbs-app .field-label,
.gbs-app .profile-label,
.gbs-app .application-label {
    padding-top: 0 !important;
    text-align: left !important;
}

.gbs-app .form-control,
.gbs-app .field-control,
.gbs-app .profile-control,
.gbs-app .application-control {
    width: 100% !important;
    min-width: 0 !important;
}

.gbs-app .gbs-field,
.gbs-app .gbs-field table,
.gbs-app .gbs-field-wide,
.gbs-app .gbs-field-wide table,
.gbs-app .dx-field,
.gbs-app .dx-field table {
    width: 100% !important;
    max-width: 640px !important;
}

.gbs-app .gbs-field-small,
.gbs-app .gbs-field-medium {
    width: 100% !important;
    max-width: 420px !important;
}

/* Keep summary/info cards responsive, but do not affect form fields */
.gbs-app .assignment-summary {
    grid-template-columns: repeat(auto-fit,minmax(260px,1fr)) !important;
}

.gbs-app .contact-layout {
    grid-template-columns: minmax(310px,410px) minmax(0,1fr) !important;
}

@media (max-width:1060px) {
    .gbs-app .mobile-toggle {
        display: inline-flex !important;
    }

    .gbs-app .header-user .user-meta {
        display: none !important;
    }

    .gbs-app .app-shell {
        display: block !important;
        min-height: calc(100vh - 106px) !important;
        min-height: calc(100vh - var(--header-h,72px) - 34px) !important;
    }

    .gbs-app .sidebar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        z-index: 220 !important;
        width: min(88vw,286px) !important;
        width: min(88vw,var(--sidebar-w,286px)) !important;
        height: 100vh !important;
        min-height: 100vh !important;
        transform: translateX(-105%) !important;
        transition: transform .18s ease !important;
        background: #fff !important;
        box-shadow: var(--shadow-lg) !important;
        border-right: 1px solid var(--border) !important;
    }

        .gbs-app .sidebar.open {
            transform: translateX(0) !important;
        }

    .gbs-app .sidebar-overlay.open {
        display: block !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 210 !important;
        background: rgba(11,31,58,.34) !important;
    }

    .gbs-app .main-content {
        padding: 20px 16px 32px !important;
    }

    .gbs-app .content-container {
        width: 100% !important;
    }

    .gbs-app .contact-layout {
        grid-template-columns: 1fr !important;
    }

    .gbs-app .assignment-summary {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width:680px) {
    .gbs-app .form-row,
    .gbs-app .field-row,
    .gbs-app .profile-row,
    .gbs-app .application-row {
        max-width: 100% !important;
    }

    .gbs-app .gbs-field,
    .gbs-app .gbs-field table,
    .gbs-app .gbs-field-wide,
    .gbs-app .gbs-field-wide table,
    .gbs-app .dx-field,
    .gbs-app .dx-field table {
        max-width: 100% !important;
    }
}


/* V14 - TRANSFER LISTBOX ITEM COLORS + BUTTON STANDARDIZATION */
.transfer-layout {
    grid-template-columns: minmax(280px, 1fr) 178px minmax(280px, 1fr) !important;
    align-items: stretch !important;
}

    .transfer-layout > div {
        min-width: 0;
    }

.transfer-title {
    display: flex;
    align-items: center;
    min-height: 34px;
    margin: 0 0 10px !important;
    padding: 0 2px;
    color: var(--gov-navy);
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: -.01em;
}

/* DevExpress ListBox: equal-height, modern selectable cards */
.transfer-layout .building-listbox,
.transfer-layout .dxeListBox_Moderno,
.transfer-layout .dxeListBox_Aqua,
.transfer-layout .dxeListBox_Glass,
.transfer-layout table[id$="lbAvailable"],
.transfer-layout table[id$="lbChoosen"] {
    width: 100% !important;
    max-width: none !important;
    height: 240px !important;
    border: 1px solid var(--border) !important;
    border-radius: 18px !important;
    background: #FFFFFF !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-sm) !important;
}

.transfer-layout div[id$="lbAvailable_D"],
.transfer-layout div[id$="lbChoosen_D"] {
    height: 237px !important;
    padding: 8px !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FBFF 100%) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.transfer-layout table[id$="lbAvailable_LBT"],
.transfer-layout table[id$="lbChoosen_LBT"] {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 7px !important;
}

.transfer-layout .dxeListBoxItemRow_Moderno,
.transfer-layout .dxeListBoxItemRow_Aqua,
.transfer-layout .dxeListBoxItemRow_Glass {
    height: 46px !important;
}

.transfer-layout .dxeListBoxItem_Moderno,
.transfer-layout .dxeListBoxItem_Aqua,
.transfer-layout .dxeListBoxItem_Glass {
    height: 46px !important;
    min-height: 46px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    vertical-align: middle !important;
    background: transparent !important;
    border: 0 !important;
}

    .transfer-layout .dxeListBoxItem_Moderno.dxeC,
    .transfer-layout .dxeListBoxItem_Aqua.dxeC,
    .transfer-layout .dxeListBoxItem_Glass.dxeC {
        width: 38px !important;
        padding-left: 12px !important;
        border-radius: 14px 0 0 14px !important;
    }

    .transfer-layout .dxeListBoxItem_Moderno.dxeT,
    .transfer-layout .dxeListBoxItem_Aqua.dxeT,
    .transfer-layout .dxeListBoxItem_Glass.dxeT {
        position: relative;
        padding: 8px 12px 8px 4px !important;
        border-radius: 0 14px 14px 0 !important;
        color: var(--gov-navy) !important;
        font-size: 12.5px !important;
        font-weight: 850 !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

.transfer-layout .dxeListBoxItemRow_Moderno,
.transfer-layout .dxeListBoxItemRow_Aqua,
.transfer-layout .dxeListBoxItemRow_Glass {
    background: #FFFFFF !important;
    border-radius: 14px !important;
    box-shadow: inset 0 0 0 1px var(--border), 0 1px 2px rgba(16,24,40,.04) !important;
}

    .transfer-layout .dxeListBoxItemRow_Moderno:hover,
    .transfer-layout .dxeListBoxItemRow_Aqua:hover,
    .transfer-layout .dxeListBoxItemRow_Glass:hover {
        transform: translateY(-1px);
        box-shadow: inset 0 0 0 1px rgba(13,94,166,.32), 0 8px 18px rgba(11,31,58,.08) !important;
    }

.transfer-layout .dxeListBoxItemSelected_Moderno,
.transfer-layout .dxeListBoxItemSelected_Aqua,
.transfer-layout .dxeListBoxItemSelected_Glass {
    color: var(--gov-navy) !important;
    background: transparent !important;
}

.transfer-layout .dxeListBoxItemHover_Moderno,
.transfer-layout .dxeListBoxItemHover_Aqua,
.transfer-layout .dxeListBoxItemHover_Glass {
    background: transparent !important;
}

/* Text-derived color slots. JS assigns these classes by building name. */
.transfer-layout .building-color-0 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-0 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-0 .dxeListBoxItem_Glass {
    background: #EFF6FF !important;
    color: #0B3A6E !important;
}

.transfer-layout .building-color-1 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-1 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-1 .dxeListBoxItem_Glass {
    background: #ECFDF3 !important;
    color: #14532D !important;
}

.transfer-layout .building-color-2 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-2 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-2 .dxeListBoxItem_Glass {
    background: #F0FDFA !important;
    color: #134E4A !important;
}

.transfer-layout .building-color-3 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-3 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-3 .dxeListBoxItem_Glass {
    background: #F5F3FF !important;
    color: #4C1D95 !important;
}

.transfer-layout .building-color-4 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-4 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-4 .dxeListBoxItem_Glass {
    background: #FFF7ED !important;
    color: #7C2D12 !important;
}

.transfer-layout .building-color-5 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-5 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-5 .dxeListBoxItem_Glass {
    background: #FEF2F2 !important;
    color: #7F1D1D !important;
}

.transfer-layout .building-color-6 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-6 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-6 .dxeListBoxItem_Glass {
    background: #FDF4FF !important;
    color: #701A75 !important;
}

.transfer-layout .building-color-7 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-7 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-7 .dxeListBoxItem_Glass {
    background: #F7FEE7 !important;
    color: #365314 !important;
}

.transfer-layout .building-color-8 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-8 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-8 .dxeListBoxItem_Glass {
    background: #F8FAFC !important;
    color: #334155 !important;
}

.transfer-layout .building-color-9 .dxeListBoxItem_Moderno,
.transfer-layout .building-color-9 .dxeListBoxItem_Aqua,
.transfer-layout .building-color-9 .dxeListBoxItem_Glass {
    background: #EEF2FF !important;
    color: #312E81 !important;
}

/* Optional semantic overrides for well-known names */
.transfer-layout .building-name-ceza .dxeListBoxItem_Moderno,
.transfer-layout .building-name-ceza .dxeListBoxItem_Aqua,
.transfer-layout .building-name-ceza .dxeListBoxItem_Glass {
    background: #FFF1F2 !important;
    color: #881337 !important;
}

.transfer-layout .building-name-sihhiye .dxeListBoxItem_Moderno,
.transfer-layout .building-name-sihhiye .dxeListBoxItem_Aqua,
.transfer-layout .building-name-sihhiye .dxeListBoxItem_Glass {
    background: #E0F2FE !important;
    color: #075985 !important;
}

.transfer-layout .building-name-ataturk .dxeListBoxItem_Moderno,
.transfer-layout .building-name-ataturk .dxeListBoxItem_Aqua,
.transfer-layout .building-name-ataturk .dxeListBoxItem_Glass {
    background: #EEF2FF !important;
    color: #3730A3 !important;
}

.transfer-layout .building-block-a .dxeListBoxItem_Moderno,
.transfer-layout .building-block-a .dxeListBoxItem_Aqua,
.transfer-layout .building-block-a .dxeListBoxItem_Glass {
    box-shadow: inset 4px 0 0 #16A34A !important;
}

.transfer-layout .building-block-b .dxeListBoxItem_Moderno,
.transfer-layout .building-block-b .dxeListBoxItem_Aqua,
.transfer-layout .building-block-b .dxeListBoxItem_Glass {
    box-shadow: inset 4px 0 0 #2563EB !important;
}

/* Transfer buttons: same size, color by action/name */
.transfer-buttons {
    align-self: stretch;
    justify-content: center !important;
    gap: 10px !important;
    padding-top: 44px !important;
}

    .transfer-buttons .dxbButton,
    .transfer-buttons .dxbButton_Moderno,
    .transfer-buttons .dxbButton_Aqua,
    .transfer-buttons div[id$="btnMoveSelectedItemsToRight"],
    .transfer-buttons div[id$="btnMoveAllItemsToRight"],
    .transfer-buttons div[id$="btnMoveSelectedItemsToLeft"],
    .transfer-buttons div[id$="btnMoveAllItemsToLeft"] {
        width: 170px !important;
        min-width: 170px !important;
        max-width: 170px !important;
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 13px !important;
        overflow: hidden !important;
        box-shadow: 0 8px 18px rgba(16,24,40,.10) !important;
    }

        .transfer-buttons .dxbButton .dxb,
        .transfer-buttons .dxbButton_Moderno .dxb,
        .transfer-buttons .dxbButton_Aqua .dxb,
        .transfer-buttons div[id$="btnMoveSelectedItemsToRight"] .dxb,
        .transfer-buttons div[id$="btnMoveAllItemsToRight"] .dxb,
        .transfer-buttons div[id$="btnMoveSelectedItemsToLeft"] .dxb,
        .transfer-buttons div[id$="btnMoveAllItemsToLeft"] .dxb {
            height: 40px !important;
            min-height: 40px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
        }

    .transfer-buttons .dx-vam {
        font-size: 12.5px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        letter-spacing: -.01em;
    }

    .transfer-buttons div[id$="btnMoveSelectedItemsToRight"],
    .transfer-buttons div[id$="btnMoveAllItemsToRight"],
    .transfer-action-add {
        border-color: #15803D !important;
        background: linear-gradient(180deg, #22C55E, #15803D) !important;
        color: #FFFFFF !important;
    }

    .transfer-buttons div[id$="btnMoveSelectedItemsToLeft"],
    .transfer-buttons div[id$="btnMoveAllItemsToLeft"],
    .transfer-action-remove {
        border-color: #B42318 !important;
        background: linear-gradient(180deg, #EF4444, #B42318) !important;
        color: #FFFFFF !important;
    }

    .transfer-buttons div[id$="btnMoveAllItemsToRight"],
    .transfer-action-add-all {
        background: linear-gradient(180deg, #0EA5E9, #0369A1) !important;
        border-color: #0369A1 !important;
    }

    .transfer-buttons div[id$="btnMoveAllItemsToLeft"],
    .transfer-action-remove-all {
        background: linear-gradient(180deg, #F97316, #C2410C) !important;
        border-color: #C2410C !important;
    }

    .transfer-buttons .dxbDisabled_Moderno,
    .transfer-buttons .dxbDisabled_Aqua,
    .transfer-buttons .dxbDisabled {
        opacity: .55 !important;
        filter: grayscale(.15) !important;
        box-shadow: none !important;
        cursor: not-allowed !important;
    }

/* Save preference button: prominent full-width CTA */
.save-row {
    display: flex;
    justify-content: center;
    margin-top: 20px !important;
}

    .save-row div[id$="btn_gonder"],
    .save-preference-button {
        position: relative !important;
        width: min(100%, 680px) !important;
        max-width: 680px !important;
        min-height: 52px !important;
        height: 52px !important;
        border: 0 !important;
        border-radius: 16px !important;
        background: linear-gradient(135deg, #0B1F3A 0%, #0D5EA6 58%, #1B75BB 100%) !important;
        color: #FFFFFF !important;
        box-shadow: 0 16px 34px rgba(13,94,166,.28) !important;
        overflow: hidden !important;
    }

        .save-row div[id$="btn_gonder"]::before,
        .save-preference-button::before {
            content: "✓";
            position: absolute;
            left: 20px;
            top: 50%;
            width: 28px;
            height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            transform: translateY(-50%);
            border-radius: 999px;
            background: rgba(255,255,255,.18);
            color: #FFFFFF;
            font-size: 16px;
            font-weight: 900;
            z-index: 2;
        }

        .save-row div[id$="btn_gonder"]::after,
        .save-preference-button::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent);
            transform: translateX(-120%);
            transition: transform .45s ease;
        }

        .save-row div[id$="btn_gonder"]:hover::after,
        .save-preference-button:hover::after {
            transform: translateX(120%);
        }

        .save-row div[id$="btn_gonder"] .dxb,
        .save-preference-button .dxb {
            height: 52px !important;
            min-height: 52px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 24px 0 56px !important;
        }

        .save-row div[id$="btn_gonder"] .dx-vam,
        .save-preference-button .dx-vam {
            color: #FFFFFF !important;
            font-size: 14px !important;
            font-weight: 900 !important;
            letter-spacing: -.01em;
            white-space: normal !important;
            line-height: 1.25 !important;
        }

        .save-row div[id$="btn_gonder"]:hover,
        .save-preference-button:hover {
            transform: translateY(-1px);
            box-shadow: 0 20px 42px rgba(13,94,166,.34) !important;
        }

@media (max-width: 980px) {
    .transfer-layout {
        grid-template-columns: 1fr !important;
    }

    .transfer-buttons {
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        flex-wrap: wrap !important;
    }

        .transfer-buttons .dxbButton,
        .transfer-buttons .dxbButton_Moderno,
        .transfer-buttons .dxbButton_Aqua,
        .transfer-buttons div[id$="btnMoveSelectedItemsToRight"],
        .transfer-buttons div[id$="btnMoveAllItemsToRight"],
        .transfer-buttons div[id$="btnMoveSelectedItemsToLeft"],
        .transfer-buttons div[id$="btnMoveAllItemsToLeft"] {
            width: min(100%, 170px) !important;
        }
}

@media (max-width: 520px) {
    .transfer-buttons {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 8px !important;
    }

        .transfer-buttons .dxbButton,
        .transfer-buttons .dxbButton_Moderno,
        .transfer-buttons .dxbButton_Aqua,
        .transfer-buttons div[id$="btnMoveSelectedItemsToRight"],
        .transfer-buttons div[id$="btnMoveAllItemsToRight"],
        .transfer-buttons div[id$="btnMoveSelectedItemsToLeft"],
        .transfer-buttons div[id$="btnMoveAllItemsToLeft"] {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }

    .save-row div[id$="btn_gonder"] .dxb,
    .save-preference-button .dxb {
        padding-left: 46px !important;
        padding-right: 14px !important;
    }

    .save-row div[id$="btn_gonder"] .dx-vam,
    .save-preference-button .dx-vam {
        font-size: 13px !important;
    }
}

/* ACTIVE ASSIGNMENT DETAILS - MODERN CARD VERSION */
.assignment-picker-card,
.assignment-summary-card,
.assignment-location-card,
.assignment-guidance-card,
.assignment-decision-card {
    overflow: hidden;
}

.assignment-picker-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
    gap: 24px;
    align-items: end;
}

.assignment-picker-copy h2,
.assignment-hero-line h2 {
    margin: 8px 0 8px;
    color: var(--gov-navy);
    font-size: clamp(21px, 2.4vw, 28px);
    line-height: 1.18;
    font-weight: 900;
    letter-spacing: -.025em;
}

.assignment-picker-copy p,
.assignment-decision-text {
    margin: 0;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.7;
}

.assignment-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 11px;
    border: 1px solid #CFE0F5;
    border-radius: 999px;
    background: #F7FBFF;
    color: var(--gov-blue);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.assignment-picker-control {
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: linear-gradient(180deg, #FFFFFF 0%, #F9FBFD 100%);
    box-shadow: var(--shadow-sm);
}

.assignment-inline-warning {
    display: block;
    margin-top: 14px;
    color: var(--danger) !important;
    font-size: 13px;
    font-weight: 800;
}

.assignment-empty-panel {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
    margin-bottom: 22px;
    padding: 20px;
    border: 1px solid var(--warning-border);
    border-radius: var(--radius-lg);
    background: var(--warning-bg);
    color: var(--warning-text);
}

    .assignment-empty-panel strong {
        display: block;
        color: var(--warning-text);
        font-size: 16px;
        font-weight: 900;
    }

    .assignment-empty-panel span {
        display: block;
        margin-top: 4px;
        font-size: 13px;
        line-height: 1.6;
    }

.assignment-empty-icon {
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: #FFF2C7;
    color: #8A5A00;
}

    .assignment-empty-icon svg {
        width: 24px;
        height: 24px;
    }

.assignment-result-panel {
    display: block;
}

.assignment-hero-line {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: flex-start;
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border);
}

    .assignment-hero-line h2 {
        max-width: 850px;
    }

.assignment-status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid var(--success-border);
    border-radius: 999px;
    background: var(--success-bg);
    color: var(--success);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.assignment-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.assignment-info-card {
    min-height: 116px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: linear-gradient(180deg, #FFFFFF 0%, #FBFDFF 100%);
    box-shadow: var(--shadow-sm);
    position: relative;
    overflow: hidden;
}

    .assignment-info-card::before {
        content: "";
        position: absolute;
        inset: 0 auto 0 0;
        width: 5px;
        background: var(--gov-blue);
    }

.assignment-info-date::before {
    background: #0D5EA6;
}

.assignment-info-time::before {
    background: #0E7490;
}

.assignment-info-role::before {
    background: #7C3AED;
}

.assignment-info-center::before {
    background: #B45309;
}

.assignment-info-label {
    display: block;
    margin-bottom: 8px;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.assignment-info-card strong {
    display: block;
    color: var(--gov-navy);
    font-size: 16px;
    line-height: 1.4;
    font-weight: 900;
    word-break: break-word;
}

.assignment-duty-warning {
    display: block;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid var(--danger-border);
    border-radius: 14px;
    background: var(--danger-bg);
    color: var(--danger) !important;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.55;
}

.assignment-location-box {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    padding: 22px;
    border: 1px solid #CFE0F5;
    border-radius: 20px;
    background: radial-gradient(circle at top right, rgba(13, 94, 166, .10), transparent 18rem), linear-gradient(180deg, #F8FBFF 0%, #FFFFFF 100%);
}

.assignment-location-marker {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #CFE0F5;
    border-radius: 20px;
    background: #EEF6FF;
    color: var(--gov-blue);
}

    .assignment-location-marker svg {
        width: 28px;
        height: 28px;
    }

.assignment-location-content span {
    display: block;
    margin-bottom: 6px;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.assignment-location-content strong {
    display: block;
    color: var(--gov-navy);
    font-size: clamp(18px, 2vw, 23px);
    line-height: 1.35;
    font-weight: 900;
}

.assignment-location-content p {
    margin: 10px 0 0;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.7;
}

.assignment-announcement {
    display: block !important;
    margin-bottom: 14px;
    color: var(--text);
    font-size: 14px;
    line-height: 1.7;
}

.assignment-link-panel {
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 1px solid var(--info-border);
    border-radius: 16px;
    background: var(--info-bg);
}

    .assignment-guideline-link,
    .assignment-link-panel a {
        color: var(--gov-blue) !important;
        font-weight: 900 !important;
        text-decoration: none !important;
    }

        .assignment-guideline-link:hover,
        .assignment-link-panel a:hover {
            color: var(--gov-navy) !important;
            text-decoration: underline !important;
        }

.assignment-document-panel-modern {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 18px;
    padding: 20px;
    border: 1px solid var(--border);
    border-radius: 20px;
    background: linear-gradient(180deg, #FFFFFF 0%, #F9FBFD 100%);
    box-shadow: var(--shadow-sm);
}

.assignment-document-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #D8E6F7;
    border-radius: 20px;
    background: #F2F7FD;
    color: var(--gov-navy);
}

    .assignment-document-icon svg {
        width: 28px;
        height: 28px;
    }

.assignment-document-content a:first-child {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 14px;
    margin-bottom: 12px;
    border: 1px solid var(--gov-blue);
    border-radius: 12px;
    background: #FFFFFF;
    color: var(--gov-blue);
    font-weight: 900;
    text-decoration: none;
}

    .assignment-document-content a:first-child:hover {
        background: #F2F8FF;
        color: var(--gov-navy);
    }

.assignment-document-content strong {
    display: block;
    margin-bottom: 6px;
    color: var(--danger);
    font-weight: 900;
}

.assignment-document-content p {
    margin: 6px 0;
    color: var(--text-soft);
    font-size: 13px;
    line-height: 1.65;
}

    .assignment-document-content p a {
        color: var(--gov-blue);
        font-weight: 850;
        text-decoration: none;
    }

        .assignment-document-content p a:hover {
            text-decoration: underline;
        }

.assignment-action-panel {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}

    .assignment-action-panel .dxbButton,
    .assignment-action-panel .dxbButton_Moderno,
    .assignment-action-panel .dxbButton_Aqua,
    #ContentPlaceHolder1_btn_kabul,
    #ContentPlaceHolder1_btn_red {
        width: 100% !important;
        min-height: 52px !important;
        border-radius: 16px !important;
        overflow: hidden !important;
    }

    .assignment-action-panel .dxb,
    #ContentPlaceHolder1_btn_kabul_CD,
    #ContentPlaceHolder1_btn_red_CD {
        min-height: 52px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 18px !important;
    }

#ContentPlaceHolder1_btn_kabul {
    border: 1px solid #0F8A5F !important;
    background: linear-gradient(180deg, #18A875, #0E7D56) !important;
    color: #FFFFFF !important;
    box-shadow: 0 14px 24px rgba(15, 138, 95, .20) !important;
}

#ContentPlaceHolder1_btn_red {
    border: 1px solid #C2410C !important;
    background: linear-gradient(180deg, #EA580C, #B42318) !important;
    color: #FFFFFF !important;
    box-shadow: 0 14px 24px rgba(180, 35, 24, .18) !important;
}

    #ContentPlaceHolder1_btn_kabul .dx-vam,
    #ContentPlaceHolder1_btn_red .dx-vam {
        color: #FFFFFF !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        letter-spacing: .01em;
    }

    #ContentPlaceHolder1_btn_kabul img,
    #ContentPlaceHolder1_btn_red img {
        width: 20px !important;
        height: 20px !important;
        object-fit: contain;
    }

.assignment-popup-host {
    height: 0;
    overflow: visible;
}

.popup-footer-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 16px 0 10px;
}

.popup-message-box {
    padding: 18px 20px;
    color: var(--text-soft);
    font-size: 14px;
    line-height: 1.7;
}

    .popup-message-box p {
        margin: 0 0 12px;
    }

    .popup-message-box strong {
        color: var(--gov-navy);
        font-weight: 900;
    }

.popup-message-danger strong {
    color: var(--danger);
}

.tax-base-panel {
    display: grid;
    gap: 14px;
    padding: 18px 20px;
    text-align: left;
}

    .tax-base-panel > strong {
        color: var(--gov-navy);
        font-size: 15px;
        line-height: 1.55;
    }

.tax-base-field {
    display: grid;
    gap: 8px;
}

    .tax-base-field label {
        color: var(--text-soft);
        font-size: 13px;
        font-weight: 900;
    }

.tax-base-panel p {
    margin: 0;
    color: var(--danger);
    font-size: 13px;
    line-height: 1.6;
}

.dx-close-icon {
    display: none !important;
}

@media (max-width: 1100px) {
    .assignment-info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .assignment-picker-layout {
        grid-template-columns: 1fr;
    }

    .assignment-hero-line {
        flex-direction: column;
    }

    .assignment-status-pill {
        align-self: flex-start;
    }

    .assignment-action-panel {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .assignment-info-grid {
        grid-template-columns: 1fr;
    }

    .assignment-location-box,
    .assignment-document-panel-modern,
    .assignment-empty-panel {
        grid-template-columns: 1fr;
    }

    .assignment-location-marker,
    .assignment-document-icon,
    .assignment-empty-icon {
        width: 52px;
        height: 52px;
        border-radius: 16px;
    }

    .popup-footer-actions {
        flex-direction: column;
        align-items: stretch;
    }

        .popup-footer-actions .dxbButton,
        .popup-footer-actions .dxbButton_Moderno,
        .popup-footer-actions .dxbButton_Aqua {
            width: 100% !important;
        }
}

/* V16 - Görev yeri kartı kompakt görünüm düzeltmesi
   Amaç: Konum SVG'sinin içerik alanını kaplamasını engellemek ve görev yeri bilgisini kompakt kart olarak göstermek. */
.gbs-app .assignment-location-card .card-body,
.assignment-location-card .card-body {
    padding: 14px 16px !important;
}

.gbs-app .assignment-location-card .assignment-location-box,
.assignment-location-card .assignment-location-box {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    min-height: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid #D9E7F6 !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, #F9FCFF 0%, #FFFFFF 100%) !important;
}

.gbs-app .assignment-location-card .assignment-location-marker,
.assignment-location-card .assignment-location-marker {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    flex: 0 0 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #CFE8FF !important;
    border-radius: 13px !important;
    background: #EEF6FF !important;
    color: var(--gov-blue) !important;
    overflow: hidden !important;
}

    .gbs-app .assignment-location-card .assignment-location-marker svg,
    .assignment-location-card .assignment-location-marker svg {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        max-width: 18px !important;
        max-height: 18px !important;
        flex: 0 0 18px !important;
        display: block !important;
        overflow: visible !important;
    }

        .gbs-app .assignment-location-card .assignment-location-marker svg path,
        .gbs-app .assignment-location-card .assignment-location-marker svg circle,
        .assignment-location-card .assignment-location-marker svg path,
        .assignment-location-card .assignment-location-marker svg circle {
            vector-effect: non-scaling-stroke;
        }

.gbs-app .assignment-location-card .assignment-location-content,
.assignment-location-card .assignment-location-content {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

    .gbs-app .assignment-location-card .assignment-location-content span,
    .assignment-location-card .assignment-location-content span {
        margin-bottom: 4px !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
    }

    .gbs-app .assignment-location-card .assignment-location-content strong,
    .assignment-location-card .assignment-location-content strong {
        font-size: clamp(14px, 1.45vw, 17px) !important;
        line-height: 1.45 !important;
    }

    .gbs-app .assignment-location-card .assignment-location-content p,
    .assignment-location-card .assignment-location-content p {
        margin-top: 6px !important;
        font-size: 12.5px !important;
        line-height: 1.6 !important;
    }

@media (max-width: 640px) {
    .gbs-app .assignment-location-card .assignment-location-box,
    .assignment-location-card .assignment-location-box {
        gap: 10px !important;
        padding: 13px !important;
    }

    .gbs-app .assignment-location-card .assignment-location-marker,
    .assignment-location-card .assignment-location-marker {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
        max-width: 36px !important;
        max-height: 36px !important;
        flex-basis: 36px !important;
        border-radius: 12px !important;
    }

        .gbs-app .assignment-location-card .assignment-location-marker svg,
        .assignment-location-card .assignment-location-marker svg {
            width: 16px !important;
            height: 16px !important;
            min-width: 16px !important;
            min-height: 16px !important;
            max-width: 16px !important;
            max-height: 16px !important;
            flex-basis: 16px !important;
        }
}

/* V17 - HEADER LOGO VISIBILITY FIX
   Sorun: header-logo-mark img üzerinde filter: brightness(0) invert(1) uygulanınca
   renkli/kurumsal PNG logo görünmez veya boş beyaz alan gibi görünebilir.
   Bu blok dosyanın sonunda olduğu için önceki kuralları ezer. */
.header-logo-mark {
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    min-height: 50px !important;
    flex: 0 0 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px !important;
    border: 1px solid rgba(13, 94, 166, .20) !important;
    border-radius: 16px !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 20px rgba(11, 31, 58, .14) !important;
    overflow: hidden !important;
}

    .header-logo-mark img,
    .header-logo-mark .header-logo-img,
    .header-logo-mark input[type="image"] {
        display: block !important;
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        max-width: 38px !important;
        max-height: 38px !important;
        object-fit: contain !important;
        object-position: center center !important;
        filter: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .header-logo-mark:empty::before {
        content: "AÜ";
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 12px;
        background: linear-gradient(145deg, var(--gov-navy), var(--gov-blue));
        color: #FFFFFF;
        font-size: 13px;
        font-weight: 900;
        letter-spacing: -.02em;
    }

@media (max-width: 640px) {
    .header-logo-mark {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        flex-basis: 44px !important;
        padding: 5px !important;
        border-radius: 14px !important;
    }

        .header-logo-mark img,
        .header-logo-mark .header-logo-img,
        .header-logo-mark input[type="image"] {
            width: 34px !important;
            height: 34px !important;
            min-width: 34px !important;
            min-height: 34px !important;
            max-width: 34px !important;
            max-height: 34px !important;
        }
}

/* V20 - COMPACT STATUS / WARNING MESSAGES
   Sınav seçimi sonrası gösterilen uyarı, bilgi, başarı ve hata mesajları için
   küçük paddingli, kart uyumlu, modern mesaj tasarımı.
*/
.gbs-app .compact-alert,
.gbs-app .exam-message,
.gbs-app #ContentPlaceHolder1_lblSinavUyari,
.gbs-app #ContentPlaceHolder1_lblGorevliIhtiyaci {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: fit-content !important;
    max-width: min(100%, 760px) !important;
    min-height: 34px !important;
    margin: 10px 0 0 !important;
    padding: 7px 11px !important;
    border-radius: 12px !important;
    border: 1px solid var(--danger-border, #FDA29B) !important;
    background: var(--danger-bg, #FEF3F2) !important;
    color: #B42318 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    letter-spacing: -.005em !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04) !important;
    vertical-align: middle !important;
}

    .gbs-app .compact-alert::before,
    .gbs-app .exam-message::before,
    .gbs-app #ContentPlaceHolder1_lblSinavUyari::before,
    .gbs-app #ContentPlaceHolder1_lblGorevliIhtiyaci::before {
        content: "!";
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: rgba(180, 35, 24, .12) !important;
        color: #B42318 !important;
        font-size: 12px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
    }

/* Mesaj alanı selector kartından sonra geliyorsa boşlukları sıkı tut */
.gbs-app .selector-card + .form-control-stack {
    gap: 8px !important;
    margin-top: 8px !important;
}

/* Mesaj türleri */
.gbs-app .compact-alert-danger,
.gbs-app .exam-message-danger {
    border-color: var(--danger-border, #FDA29B) !important;
    background: var(--danger-bg, #FEF3F2) !important;
    color: #B42318 !important;
}

    .gbs-app .compact-alert-danger::before,
    .gbs-app .exam-message-danger::before {
        content: "!";
        background: rgba(180, 35, 24, .12) !important;
        color: #B42318 !important;
    }

.gbs-app .compact-alert-warning,
.gbs-app .exam-message-warning {
    border-color: var(--warning-border, #F2D27A) !important;
    background: var(--warning-bg, #FFF8E6) !important;
    color: #92400E !important;
}

    .gbs-app .compact-alert-warning::before,
    .gbs-app .exam-message-warning::before {
        content: "!";
        background: rgba(180, 83, 9, .13) !important;
        color: #B45309 !important;
    }

.gbs-app .compact-alert-info,
.gbs-app .exam-message-info {
    border-color: var(--info-border, #B8DDFB) !important;
    background: var(--info-bg, #EAF4FF) !important;
    color: var(--gov-navy, #0B1F3A) !important;
}

    .gbs-app .compact-alert-info::before,
    .gbs-app .exam-message-info::before {
        content: "i";
        background: rgba(13, 94, 166, .12) !important;
        color: var(--gov-blue, #0D5EA6) !important;
        font-family: Georgia, serif !important;
        font-style: italic !important;
    }

.gbs-app .compact-alert-success,
.gbs-app .exam-message-success {
    border-color: var(--success-border, #ABEFC6) !important;
    background: var(--success-bg, #ECFDF3) !important;
    color: #067647 !important;
}

    .gbs-app .compact-alert-success::before,
    .gbs-app .exam-message-success::before {
        content: "✓";
        background: rgba(22, 121, 76, .12) !important;
        color: #067647 !important;
    }

/* Jcrop'un çalıştığı resim ve sarmalayıcısı responsive kurallardan muaf tutulmalı */
#imgYuklenenResim,
.jcrop-holder,
.jcrop-holder img {
    max-width: none !important;
    width: auto !important;
    height: auto !important;
}

/* Taşma olursa küçültmek yerine yatayda kaydırma sağla */
#Panel1 {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}