/* ═══ AppBrand — global (RenderTreeBuilder scoped CSS almaz) ═══ */



.logo-area,

.ym-logo {

    display: flex;

    align-items: center;

    gap: 14px;

    min-width: 0;

    flex: 1 1 auto;

}



.login-logo-icon {

    width: 62px;

    height: 62px;

    border-radius: 16px;

    position: relative;

    background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 50%, #3b82f6 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.25);

    margin: 0 auto 14px;

    flex-shrink: 0;

}



.login-logo-pulse {

    position: absolute;

    inset: -4px;

    border-radius: 18px;

    background: linear-gradient(135deg, rgba(37, 99, 235, 0.15), rgba(59, 130, 246, 0.1));

    animation: ab-login-glow 4s ease-in-out infinite;

    z-index: 0;

}



@keyframes ab-login-glow {

    0%, 100% { opacity: 0.4; transform: scale(1); }

    50% { opacity: 0.8; transform: scale(1.05); }

}



.login-logo-letter {

    width: 60%;

    height: 60%;

    z-index: 1;

    fill: white;

    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));

}



.login-logo-title {

    display: flex;

    align-items: baseline;

    justify-content: center;

    line-height: 1;

    margin-bottom: 4px;

}



.login-logo-medi {

    font-size: 2.4rem;

    font-weight: 900;

    letter-spacing: 5px;

    background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #334155 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

    font-family: 'Segoe UI', 'Inter', 'Helvetica Neue', Arial, sans-serif;

}



.login-logo-sist {

    font-size: 2.4rem;

    font-weight: 900;

    letter-spacing: 5px;

    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 40%, #60a5fa 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

    font-family: 'Segoe UI', 'Inter', 'Helvetica Neue', Arial, sans-serif;

}



.reset-logo-icon {

    width: 54px;

    height: 54px;

    border-radius: 14px;

    background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 50%, #3b82f6 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 12px;

    box-shadow: 0 6px 18px rgba(37, 99, 235, 0.25);

    flex-shrink: 0;

}



.reset-logo-letter {

    color: white;

    font-size: 1.6rem;

    font-weight: 900;

    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);

}



.reset-logo-title {

    display: flex;

    align-items: baseline;

    justify-content: center;

    line-height: 1;

}



.reset-logo-medi {

    font-size: 1.8rem;

    font-weight: 900;

    letter-spacing: 4px;

    background: linear-gradient(135deg, #0f172a, #1e3a5f, #334155);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

}



.reset-logo-sist {

    font-size: 1.8rem;

    font-weight: 900;

    letter-spacing: 4px;

    background: linear-gradient(135deg, #2563eb, #3b82f6, #60a5fa);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

}



.logo-icon {

    width: 42px;

    height: 42px;

    border-radius: 12px;

    position: relative;

    background: linear-gradient(135deg, var(--t-sidebar, #1e3a5f) 0%, var(--t-accent, #2563eb) 50%, var(--t-sidebar-active, #3b82f6) 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 4px 20px color-mix(in srgb, var(--t-accent, #2563eb) 25%, transparent);

    flex-shrink: 0;

}



.logo-pulse {

    position: absolute;

    inset: -3px;

    border-radius: 14px;

    background: linear-gradient(135deg, color-mix(in srgb, var(--t-accent, #2563eb) 15%, transparent), color-mix(in srgb, var(--t-sidebar-active, #3b82f6) 10%, transparent));

    animation: ab-logo-glow 3s ease-in-out infinite;

    z-index: 0;

}



@keyframes ab-logo-glow {

    0%, 100% { opacity: 0.5; transform: scale(1); }

    50% { opacity: 0.9; transform: scale(1.06); }

}



.logo-letter {

    width: 60%;

    height: 60%;

    z-index: 1;

    fill: white;

    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2));

}



.logo-text,

.ym-logo-text {

    display: flex;

    flex-direction: column;

    gap: 2px;

    min-width: 0;

    flex: 1 1 auto;

}



.logo-title,

.ym-logo-title {

    display: flex;

    align-items: baseline;

    line-height: 1.1;

}



.logo-medi {
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    color: var(--t-text, #1e293b);
}

.ym-logo-medi {
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    background: linear-gradient(90deg, var(--t-topbar-text, #f1f5f9), #ffffff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.logo-sist {
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    background: linear-gradient(90deg, var(--t-accent, #2563eb), var(--t-sidebar-active, #3b82f6));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.ym-logo-sist {
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: 1.5px;
    background: linear-gradient(90deg, var(--t-accent, #3b82f6), var(--t-sidebar-active, #60a5fa));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}



.system-subtitle {

    color: var(--t-text-muted, #94a3b8);

    font-size: 0.6rem;

    font-weight: 600;

    letter-spacing: 3.5px;

    text-transform: uppercase;

    display: flex;

    align-items: center;

    gap: 4px;

    min-width: 0;

    flex-wrap: nowrap;

}



.system-subtitle .subtitle-text {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    min-width: 0;

    flex: 0 1 auto;

}



.system-subtitle .ver-sep,

.system-subtitle .ver-inline,

.system-subtitle .ver-new-dot {

    flex-shrink: 0;

}



.ym-logo-icon {

    width: 42px;

    height: 42px;

    border-radius: 12px;

    position: relative;

    background: linear-gradient(135deg, var(--t-sidebar, #1e3a5f) 0%, var(--t-accent, #2563eb) 50%, var(--t-sidebar-active, #3b82f6) 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 4px 20px color-mix(in srgb, var(--t-accent, #2563eb) 25%, transparent), 0 0 0 1px rgba(255, 255, 255, 0.1) inset;

    flex-shrink: 0;

}



.ym-logo-pulse {

    position: absolute;

    inset: -3px;

    border-radius: 14px;

    background: linear-gradient(135deg, color-mix(in srgb, var(--t-accent, #2563eb) 15%, transparent), color-mix(in srgb, var(--t-sidebar-active, #3b82f6) 10%, transparent));

    animation: ab-ym-logo-glow 3s ease-in-out infinite;

    z-index: 0;

}



@keyframes ab-ym-logo-glow {

    0%, 100% { opacity: 0.5; transform: scale(1); }

    50% { opacity: 0.9; transform: scale(1.06); }

}



.ym-logo-letter {

    width: 60%;

    height: 60%;

    z-index: 1;

    fill: white;

    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25));

}



.ym-sub {

    color: color-mix(in srgb, var(--t-topbar-text, #fff) 60%, transparent);

    font-size: 0.6rem;

    font-weight: 600;

    letter-spacing: 3.5px;

    text-transform: uppercase;

    display: flex;

    align-items: center;

    gap: 4px;

    min-width: 0;

    flex-wrap: nowrap;

}



.ym-sub .ym-sub-text {

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    min-width: 0;

    flex: 0 1 auto;

}



.ym-sub .ver-sep,

.ym-sub .ver-inline,

.ym-sub .ver-new-dot {

    flex-shrink: 0;

}



.portal-brand {

    display: flex;

    align-items: center;

    gap: 14px;

}



.portal-logo-icon {

    width: 38px;

    height: 38px;

    border-radius: 12px;

    background: linear-gradient(135deg, var(--portal-accent, #2563eb), var(--portal-accent-2, #3b82f6));

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.15);

    flex-shrink: 0;

}



.portal-logo-icon svg {

    width: 22px;

    height: 22px;

    fill: white;

}



.portal-brand-text {

    display: flex;

    align-items: baseline;

    gap: 8px;

}



.portal-brand-name {

    display: flex;

    align-items: baseline;

}



.portal-brand-medi {

    font-weight: 900;

    letter-spacing: 1px;

    color: var(--t-text, #0f172a);

}



.portal-brand-sist {

    font-weight: 900;

    letter-spacing: 1px;

    color: var(--portal-accent, #2563eb);

}



.logo-text-wrap {

    display: flex;

    flex-direction: column;

    gap: 2px;

    min-width: 0;

}



.sidebar-header .logo-text-wrap {

    flex: 1;

    min-width: 0;

}



.logo-text-wrap > .logo-text {

    font-size: 0.95rem;

    font-weight: 900;

    letter-spacing: 1px;

    color: var(--t-text, #1e293b);

}



.logo-sub {

    font-size: 0.58rem;

    font-weight: 600;

    letter-spacing: 1.5px;

    text-transform: uppercase;

    color: var(--t-text-muted, #94a3b8);

}



.sp-logo-wrap {

    position: relative;

    width: 96px;

    height: 96px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 28px;

}



.sp-icon {

    width: 80px;

    height: 80px;

    border-radius: 20px;

    background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 50%, #3b82f6 100%);

    display: flex;

    align-items: center;

    justify-content: center;

    box-shadow: 0 8px 32px rgba(37, 99, 235, 0.25);

    flex-shrink: 0;

}



.sp-icon svg {

    width: 50%;

    height: 50%;

    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));

}



.sp-brand {

    display: flex;

    align-items: baseline;

    justify-content: center;

}



.sp-medi {

    font-size: 1.35rem;

    font-weight: 900;

    letter-spacing: 0.06em;

    color: #0f172a;

}



.sp-sist {

    font-size: 1.35rem;

    font-weight: 900;

    letter-spacing: 0.06em;

    color: #2563eb;

}



@media (max-width: 600px) {

    .logo-area { gap: 8px; }

    .logo-icon,

    .ym-logo-icon { width: 34px; height: 34px; border-radius: 9px; }

    .ym-sub { font-size: 0.5rem; letter-spacing: 2.5px; }

    .system-subtitle { font-size: 0.5rem; letter-spacing: 2.5px; }

}



@media (max-width: 480px) {

    .login-logo-icon { width: 42px; height: 42px; margin-bottom: 6px; }

    .login-logo-letter { width: 58%; height: 58%; }

    .login-logo-medi,

    .login-logo-sist { font-size: 1.9rem; letter-spacing: 3px; }

}



/* ═══ Özel şirket markası — kare logo + kısa ünvan ═══ */



.app-brand-logo {

    width: 100%;

    height: 100%;

    max-width: 100%;

    max-height: 100%;

    object-fit: contain;

    display: block;

}



.app-brand-custom-name {

    font-weight: 800;

    letter-spacing: 0.02em;

    color: var(--t-text, #0f172a);

    line-height: 1.15;

    word-break: break-word;

}



.login-logo-icon--custom,

.reset-logo-icon--custom {

    width: 62px;

    height: 62px;

    border-radius: 16px;

    margin: 0 auto 14px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    padding: 6px;

    background: var(--t-card, #fff) !important;

    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.12);

    border: 1px solid var(--t-card-border, #e2e8f0);

}



.login-logo-icon--custom .app-brand-logo,

.reset-logo-icon--custom .app-brand-logo {

    width: 100%;

    height: 100%;

    max-width: 50px;

    max-height: 50px;

    object-fit: contain;

    object-position: center;

    background: transparent !important;

    padding: 0;

    border: none;

    box-shadow: none;

}



.reset-logo-icon--custom {

    width: 54px;

    height: 54px;

    border-radius: 14px;

    margin-bottom: 12px;

}



.reset-logo-icon--custom .app-brand-logo {

    max-width: 54px;

    max-height: 54px;

}



.logo-icon--custom,

.ym-logo-icon--custom {

    width: 42px;

    height: 42px;

    border-radius: 12px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    padding: 4px;

    background: var(--t-card, #fff) !important;

    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.12);

    border: 1px solid var(--t-card-border, #e2e8f0);

}



.logo-icon--custom .app-brand-logo,

.ym-logo-icon--custom .app-brand-logo {

    width: 100%;

    height: 100%;

    max-width: 34px;

    max-height: 34px;

    object-fit: contain;

    object-position: center;

    background: transparent !important;

    padding: 0;

    border: none;

    box-shadow: none;

}



.portal-logo-icon--custom {

    width: 38px;

    height: 38px;

    border-radius: 12px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    padding: 4px;

    background: var(--t-card, #fff) !important;

    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.1);

    border: 1px solid var(--t-card-border, #e2e8f0);

}



.portal-logo-icon--custom .app-brand-logo {

    width: 100%;

    height: 100%;

    max-width: 30px;

    max-height: 30px;

    object-fit: contain;

    background: transparent !important;

    padding: 0;

    border: none;

    box-shadow: none;

}



.login-logo-icon--custom { box-shadow: none; }

.login-logo-icon--custom .login-logo-pulse { display: none; }



.logo-icon--custom .logo-pulse,

.ym-logo-icon--custom .ym-logo-pulse { display: none; }



.login-logo-title--custom,

.reset-logo-title--custom {

    display: flex;

    align-items: baseline;

    justify-content: center;

    line-height: 1;

    margin-bottom: 4px;

    width: 100%;

}



.logo-title--custom,

.ym-logo-title--custom {

    display: flex;

    align-items: baseline;

    justify-content: flex-start;

    line-height: 1.1;

    margin-bottom: 0;

    width: auto;

}



.login-logo-title--custom .app-brand-custom-name {

    font-size: 2.4rem;

    font-weight: 900;

    letter-spacing: 5px;

    font-family: 'Segoe UI', 'Inter', 'Helvetica Neue', Arial, sans-serif;

    background: linear-gradient(135deg, #0f172a 0%, #1e3a5f 50%, #334155 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

    color: transparent;

    display: inline-block;

    text-align: center;

    padding-right: 5px;

    max-width: min(100%, 320px);

    word-break: break-word;

    line-height: 1;

}



.reset-logo-title--custom .app-brand-custom-name {

    font-size: 1.8rem;

    letter-spacing: 4px;

    padding-right: 4px;

}



.logo-title--custom .app-brand-custom-name,

.ym-logo-title--custom .app-brand-custom-name {

    font-size: 1.2rem;

    font-weight: 900;

    letter-spacing: 1.5px;

    max-width: min(220px, 42vw);

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    display: inline-block;

    padding-right: 0;

}



.logo-title--custom .app-brand-custom-name {

    color: var(--t-text, #1e293b);

}



.ym-logo-title--custom .app-brand-custom-name {

    background: linear-gradient(90deg, var(--t-topbar-text, #f1f5f9), #ffffff);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

}



.logo-text-wrap > .logo-text.app-brand-custom-name {

    font-size: 0.95rem;

    font-weight: 900;

    letter-spacing: 1px;

    color: var(--t-text, #1e293b);

}



.portal-brand-name.app-brand-custom-name {

    font-size: 1.15rem;

}



.sidebar-brand-custom {

    display: flex;

    align-items: center;

    gap: 10px;

    min-width: 0;

    flex: 1;

}



.sidebar-brand-logo {

    width: 32px;

    height: 32px;

    flex-shrink: 0;

    border-radius: 8px;

    background: var(--t-card, #fff);

    padding: 3px;

    border: 1px solid var(--t-card-border, #e2e8f0);

}



.sidebar-brand-custom .app-brand-custom-name {

    font-size: 0.95rem;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

}



.sp-logo-wrap--custom .sp-ring { display: none; }



.sp-icon--custom {

    width: 80px;

    height: 80px;

    background: var(--t-card, #fff) !important;

    padding: 10px;

    border-radius: 16px;

    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.15);

    border: 1px solid var(--t-card-border, #e2e8f0);

    display: flex;

    align-items: center;

    justify-content: center;

    overflow: hidden;

    flex-shrink: 0;

}



.sp-icon--custom .app-brand-logo {

    width: 100%;

    height: 100%;

    max-width: 60px;

    max-height: 60px;

    object-fit: contain;

    background: transparent !important;

}



.sp-brand--custom .app-brand-custom-name {

    font-size: 1.35rem;

    letter-spacing: 0.06em;

}



@media (max-width: 600px) {

    .logo-icon--custom,

    .ym-logo-icon--custom { width: 34px; height: 34px; border-radius: 9px; }

}



@media (max-width: 480px) {

    .login-logo-icon--custom { width: 42px; height: 42px; margin-bottom: 6px; }

    .login-logo-icon--custom .app-brand-logo,

    .reset-logo-icon--custom .app-brand-logo {

        max-width: 42px;

        max-height: 42px;

    }

    .login-logo-title--custom .app-brand-custom-name {

        font-size: 1.9rem;

        letter-spacing: 3px;

        padding-right: 3px;

    }

}



[data-theme="dark"] .app-brand-logo-adapt,

[data-theme="midnight"] .app-brand-logo-adapt {

    filter: brightness(0) invert(1);

}



[data-theme="dark"] .login-logo-icon--custom,

[data-theme="midnight"] .login-logo-icon--custom,

[data-theme="dark"] .reset-logo-icon--custom,

[data-theme="midnight"] .reset-logo-icon--custom,

[data-theme="dark"] .logo-icon--custom,

[data-theme="midnight"] .logo-icon--custom,

[data-theme="dark"] .ym-logo-icon--custom,

[data-theme="midnight"] .ym-logo-icon--custom,

[data-theme="dark"] .portal-logo-icon--custom,

[data-theme="midnight"] .portal-logo-icon--custom,

[data-theme="dark"] .sp-icon--custom,

[data-theme="midnight"] .sp-icon--custom {

    background: rgba(255, 255, 255, 0.94) !important;

    border-color: rgba(255, 255, 255, 0.14);

}



[data-theme="dark"] .logo-text-wrap > .logo-text.app-brand-custom-name,

[data-theme="midnight"] .logo-text-wrap > .logo-text.app-brand-custom-name {

    color: var(--t-text, #f1f5f9);

}



[data-theme="dark"] .ym-logo-title--custom .app-brand-custom-name,

[data-theme="midnight"] .ym-logo-title--custom .app-brand-custom-name {

    background: linear-gradient(90deg, var(--t-topbar-text, #e2e8f0), #ffffff);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

}



[data-theme="dark"] .app-brand-custom-name,

[data-theme="midnight"] .app-brand-custom-name {

    color: var(--t-text, #f1f5f9);

}



[data-theme="dark"] .login-logo-title--custom .app-brand-custom-name,

[data-theme="midnight"] .login-logo-title--custom .app-brand-custom-name,

[data-theme="dark"] .reset-logo-title--custom .app-brand-custom-name,

[data-theme="midnight"] .reset-logo-title--custom .app-brand-custom-name {

    color: transparent;

    -webkit-text-fill-color: transparent;

    background: linear-gradient(135deg, #e2e8f0 0%, #f1f5f9 50%, #cbd5e1 100%);

    -webkit-background-clip: text;

    background-clip: text;

}