body.modal-open {
overflow: hidden;
}
.mf-input.input-validation-error,
.mf-input.is-invalid,
.bp-value-input.is-invalid,
[data-theme="dark"] .mf-input.input-validation-error,
[data-theme="dark"] .mf-input.is-invalid,
[data-theme="dark"] .bp-value-input.is-invalid {
border-color: var(--bs-form-invalid-border-color, #dc3545) !important;
}
.mf-input.input-validation-error:focus,
.mf-input.is-invalid:focus,
.bp-value-input.is-invalid:focus {
border-color: var(--mf-focus, #2D6A4F) !important;
box-shadow: none !important;
}
.mf-input::placeholder { color: var(--mf-label); opacity: 1; }
.form-floating > .mf-input:focus ~ label,
.form-floating > .mf-input:not(:placeholder-shown) ~ label {
transform: scale(.78) translateY(-.5rem) translateX(.15rem);
}
.mf-err.field-validation-error {
display: block !important;
}
.mf-err.field-validation-valid {
display: none;
}
.mf-hint {
font-size: .72rem;
color: var(--text-muted);
margin-top: .4rem;
line-height: 1.5;
}
.mf-hint:empty { display: none; margin: 0; }
.mf-hint--center { text-align: center; }
.mf-hint--inline { margin-top: 0; }
.mf-hint code {
font-size: .7rem;
background: var(--surface-2);
padding: .1rem .3rem;
border-radius: 4px;
color: var(--mf-focus);
}
[data-theme="dark"] .mf-hint code { background: #2E2E33; color: #52B788; }
.mf-divider {
height: 0;
margin: 16px 0;
border: 0;
border-top: 1px solid var(--border);
opacity: .6;
}
.mg-char-counter {
display: block;
font-size: .72rem;
color: var(--text-muted);
text-align: right;
margin-top: 2px;
line-height: 1;
}
.mg-char-counter--snug { margin-top: 2px; }
.mg-counter-warn   { color: #b8860b; font-weight: 500; }
.mg-counter-danger { color: var(--bs-danger); font-weight: 600; }
[data-theme="dark"] .mg-counter-warn   { color: #ffc107; }
[data-theme="dark"] .mg-counter-danger { color: #ff6b6b; }
:root {
--mg-bg:           #F8F8F8;
--mg-surface:      #FFFFFF;
--mg-surface-2:    #F0F0F0;
--mg-text:         #111111;
--mg-text-soft:    #555555;
--mg-text-muted:   #999999;
--mg-border:       #E2E2E2;
--mg-primary:      #2D6A4F;
--mg-primary-2:    #1B4332;
--mg-primary-soft: rgba(45, 106, 79, .1);
--mg-shadow:       0 1px 8px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.04);
--mg-shadow-lg:    0 8px 32px rgba(0,0,0,.12);
--dash-accent-5:   #ef4444;
--mg-radius:       6px;
--mg-radius-sm:    6px;
--mg-radius-lg:    8px;
--mf-border-width: 1px;   /* form girdisi kenarlık kalınlığı — tek otorite */
--app-font: "Public Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
--app-primary:      var(--mg-primary);
--app-primary-soft: var(--mg-primary-soft);
--sidebar-w: 280px; /* en uzun etiket "Görünüm & Bilgiler" tek satıra sığsın */
--submenu-w: 234px; /* tüm alt menü grupları aynı genişlikte (en uzun sublink'e göre); hover bg eşit uzar */
--layout-offset: var(--sidebar-w);
--layout-ease: 320ms cubic-bezier(.4,0,.2,1);
--page-gap:        15px;
--page-gap-mobile: calc(var(--page-gap) / 2);
--container-pad:   var(--page-gap);
--topbar-gap: 15px;
--content-gap: 15px;
--content-mobile-gap: var(--page-gap-mobile);
--card-pad:        1.4rem;
--card-pad-mobile: 1rem;
--shadow:            var(--mg-shadow);
--shadow-inset-soft: inset 0 1px 0 rgba(0, 0, 0, 0.04);
--hover-alpha: 0.08;
--bg:       var(--mg-bg);
--surface:  var(--mg-surface);
--surface-2:var(--mg-surface-2);
--text:     var(--mg-text);
--heading:  var(--mg-text);
--border:   var(--mg-border);
--ms-tog-off: var(--border);
--app-topbar-h: 50px;
--app-breadcrumb-h: 24px;
--app-header-h: calc(var(--app-topbar-h) + var(--app-breadcrumb-h) + 2 * var(--page-gap));
--radius-sm:      var(--mg-radius-sm);
--radius-md:      var(--mg-radius-sm);
--radius-lg:      var(--mg-radius-lg);
--radius-surface: var(--mg-radius);
--radius-form:    var(--mg-radius);
--radius-full: 999px;
--chip-on-accent:    #fff;
--chip-success:      #22c55e;
--chip-success-soft: rgba(34,197,94,.10);
--chip-warn:         #F57C00;
--chip-warn-soft:    rgba(245,124,0,.10);
--chip-danger:       #dc3545;
--chip-danger-soft:  rgba(220,53,69,.10);
--text-muted:  var(--mg-text-muted);
--text-soft:   var(--mg-text-soft);
--mf-label: #999999;
--scrollbar-thumb:       rgba(0, 0, 0, 0.25);
--scrollbar-thumb-hover: rgba(0, 0, 0, 0.45);
--menu-disc:        rgba(86, 106, 127, 0.35);
--menu-disc-active: var(--app-primary);
--surface-hover:    var(--app-primary-soft);
--icon-strong:  var(--heading);
--text-strong:  var(--heading);
--surface-float: var(--surface);
--shadow-float:  var(--shadow);
--mobile-footer-h: 50px;
--scroll-top-gap: 15px;
--action-bar-h-mobile: 54px;
--logo-primary:   var(--mg-primary);
--logo-secondary: var(--text);
--dropdown-p-y: 10px;
--dropdown-p-x: 10px;
--dropdown-gap: 8px;
--menu-p-y: 4px;
--menu-p-x: 10px;
--menu-gap: 8px;
--announcement-h:    0px;
--announcement-base-h: 50px;
--announcement-bg:   linear-gradient(90deg, var(--mg-primary), var(--mg-primary-2));
--announcement-text: #ffffff;
--announcement-font: var(--app-font);
--ann-success-bg:   #d1e7dd; --ann-success-fg:   #0a3622;
--ann-primary-bg:   #cfe2ff; --ann-primary-fg:   #052c65;
--ann-secondary-bg: #e2e3e5; --ann-secondary-fg: #2b2f32;
--ann-info-bg:      #cff4fc; --ann-info-fg:      #055160;
--ann-warning-bg:   #fff3cd; --ann-warning-fg:   #664d03;
--ann-danger-bg:    #f8d7da; --ann-danger-fg:    #58151c;
--ann-dark-bg:      #ced4da; --ann-dark-fg:      #495057;
--ann-light-bg:     #fcfcfd; --ann-light-fg:     #495057;
--modal-bg: var(--surface);
--modal-border: var(--border);
--modal-shadow: var(--shadow);
--modal-radius: var(--radius-lg);
--modal-header-bg: var(--surface);
--modal-footer-bg: var(--surface);
--modal-title-color: var(--heading);
--modal-text-color: var(--text);
--modal-backdrop: rgba(0, 0, 0, 0.45);
--loader-bg: rgba(255, 255, 255, 0.85);
--loader-z: 9999;
--loader-fade: 0.2s ease;
--editable-hint-bg: var(--surface-2);
--app-warning:                #d97706;
--bs-warning:                 var(--app-warning);
--bs-warning-rgb:             217, 119, 6;
--bs-form-invalid-border-color: #dc3545;
--bs-form-valid-border-color:   #198754;
--nprogress-color:              var(--mg-primary);
--mg-map-filter: none;
}
html[data-theme="dark"] {
--mg-bg:           #1A1A1D;
--mg-surface:      #242428;
--mg-surface-2:    #2E2E33;
--mg-text:         #EDEDEC;
--mg-text-soft:    #9A9A9A;
--mg-text-muted:   #5A5A5A;
--mf-label: rgba(237, 237, 236, .45);
--mg-border:       #333338;
--mg-primary:      #52B788;
--mg-primary-2:    #2D6A4F;
--mg-primary-soft: rgba(82, 183, 136, .12);
--mg-shadow:       0 1px 8px rgba(0,0,0,.4), 0 2px 4px rgba(0,0,0,.3);
--mg-shadow-lg:    0 8px 32px rgba(0,0,0,.6);
--dash-accent-5:   #f87171;
--hover-alpha: 0.12;
--shadow-inset-soft: inset 0 1px 0 rgba(255, 255, 255, 0.04);
--scrollbar-thumb:       rgba(255, 255, 255, 0.25);
--scrollbar-thumb-hover: rgba(255, 255, 255, 0.45);
--menu-disc:        rgba(255, 255, 255, 0.35);
--menu-disc-active: #ffffff;
--icon-strong:  rgba(255, 255, 255, 0.85);
--text-strong:  var(--mg-text);
--surface-float: rgba(255,255,255,0.04);
--shadow-float: none;
--announcement-bg:   linear-gradient(90deg, var(--mg-primary-2), #0f2d1e);
--announcement-text: #d1fae5;
--ann-success-bg:   #051b11; --ann-success-fg:   #75b798;
--ann-primary-bg:   #031633; --ann-primary-fg:   #6ea8fe;
--ann-secondary-bg: #161719; --ann-secondary-fg: #a7acb1;
--ann-info-bg:      #032830; --ann-info-fg:      #6edff6;
--ann-warning-bg:   #332701; --ann-warning-fg:   #ffda6a;
--ann-danger-bg:    #2c0b0e; --ann-danger-fg:    #ea868f;
--ann-dark-bg:      #1a1d20; --ann-dark-fg:      #dee2e6;
--ann-light-bg:     #343a40; --ann-light-fg:     #f8f9fa;
--modal-bg: var(--surface);
--modal-border: var(--border);
--modal-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
--modal-title-color: var(--heading);
--modal-text-color: var(--text);
--modal-backdrop: rgba(0, 0, 0, 0.65);
--loader-bg: rgba(15, 23, 42, 0.85);
--app-warning:    #fbbf24;
--bs-warning-rgb: 251, 191, 36;
--nprogress-color: var(--mg-primary);
--chip-on-accent:    #111;
--chip-success:      #4ade80;
--chip-success-soft: rgba(74,222,128,.12);
--chip-warn:         #FFB74D;
--chip-warn-soft:    rgba(255,183,77,.12);
--chip-danger:       #f87171;
--chip-danger-soft:  rgba(248,113,113,.12);
--mg-map-filter: invert(.92) hue-rotate(180deg) brightness(.95) saturate(.7);
}
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="time"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] input[type="month"],
[data-theme="dark"] input[type="week"],
[data-theme="dark"] input[type="number"] {
color-scheme: dark;
}
html,
body {
--layout-offset: var(--sidebar-w);
height: 100%;
}
body {
font-family: var(--app-font);
background: var(--bg);
color: var(--text);
}
@media (max-width: 991.98px) {
body {
--layout-offset: 0px;
height: auto;
overscroll-behavior-y: contain;
}
html {
height: auto;
overscroll-behavior-y: contain;
}
}
.app-container {
padding-left: var(--page-gap);
padding-right: var(--page-gap);
}
@media (max-width: 991.98px) {
.app-container {
padding-left: var(--page-gap-mobile);
padding-right: var(--page-gap-mobile);
}
}
.app-content {
padding-top: var(--announcement-h);
padding-bottom: calc(var(--content-gap) + env(safe-area-inset-bottom)) !important;
}
@media (max-width: 991.98px) {
.app-content {
padding-top: var(--announcement-h);
padding-bottom: calc(var(--mobile-footer-h) + var(--page-gap-mobile) + env(safe-area-inset-bottom)) !important;
}
}
body:has(.sticky-action-bar) .app-content {
padding-bottom: calc(var(--content-gap) + var(--page-gap) + var(--action-bar-h-actual, var(--action-bar-h-mobile)) + env(safe-area-inset-bottom)) !important;
}
@media (max-width: 991.98px) {
body:has(.sticky-action-bar) .app-content {
padding-bottom: calc(var(--mobile-footer-h) + var(--page-gap-mobile) + var(--action-bar-h-actual, var(--action-bar-h-mobile)) + var(--page-gap-mobile) + env(safe-area-inset-bottom)) !important;
}
}
.app-content-inner {
}
.mb-gap { margin-bottom: var(--page-gap); }
@media (max-width: 991.98px) {
.mb-gap { margin-bottom: var(--page-gap-mobile); }
}
.pt-gap { padding-top: var(--page-gap); }
@media (max-width: 991.98px) {
.pt-gap { padding-top: var(--page-gap-mobile); }
}
.mt-gap { margin-top: var(--page-gap); }
@media (max-width: 991.98px) {
.mt-gap { margin-top: var(--page-gap-mobile); }
}
.app-content .row {
--bs-gutter-x: var(--page-gap);
--bs-gutter-y: var(--page-gap);
}
@media (max-width: 991.98px) {
.app-content .row {
--bs-gutter-x: var(--page-gap-mobile);
--bs-gutter-y: var(--page-gap-mobile);
}
}
.app-sidebar {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: var(--sidebar-w);
background: var(--surface);
border-right: 1px solid var(--border);
z-index: 1030;
display: flex;
flex-direction: column;
transition: width var(--layout-ease);
}
.app-sidebar-header {
height: var(--app-topbar-h);
margin-top: 0;
display: flex;
align-items: center;
padding: 0 1.25rem;
}
.app-sidebar-body {
position: relative;
flex: 1;
overflow-y: auto;
overflow-x: hidden; /* overflow-y:auto belirtilince overflow-x örtük "auto" sayılır (CSS spec) — gereksiz yatay scrollbar'ı engeller */
scrollbar-gutter: stable;
padding: 12px 10px; /* sol = sağ simetrik boşluk */
}
.app-brand-text {
font-weight: 700;
color: var(--heading);
letter-spacing: 0.2px;
}
.app-brand-mark {
}
.app-brand-mark img {
max-height: 36px;
width: auto;
display: block;
}
.app-brand-qr {
width: 30px;
height: 30px;
flex-shrink: 0;
}
.app-brand-logo-text-svg {
height: 32px;
width: auto;
}
.mg-logo-menu  { fill: var(--mg-primary); }
.mg-logo-getir { fill: var(--mg-text); }
[data-theme="dark"] .mg-logo-getir { fill: #ffffff; }
.app-layout {
min-height: 100vh;
padding-left: var(--layout-offset);
background: var(--bg); /* içerik header arkasından sızmasın */
transition: padding-left var(--layout-ease);
}
@media (max-width: 991.98px) {
.app-layout {
min-height: 100svh; /* 🔥 klasik 100vh DEĞİL */
}
}
@media (min-width: 992px) {
.app-layout {
}
}
.app-header {
position: sticky;
top: var(--announcement-h);
z-index: 1020;
background: var(--bg);
padding-bottom: var(--page-gap);
}
@media (max-width: 991.98px) {
.app-header {
padding-bottom: var(--page-gap-mobile);
}
}
.app-topbar {
width: 100%;
padding-bottom: 0;
background: var(--bg);
}
.app-topbar-inner {
height: 50px;
justify-content: space-between;
padding: 0 12px;
background: var(--surface);
border: 1px solid var(--border);
border-bottom: 0.5px solid var(--border);
border-radius: var(--radius-surface);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
@media (min-width: 992px) {
.app-header {
padding-top: var(--page-gap);
}
.app-topbar-inner {
box-shadow: var(--shadow);
}
.app-sidebar-header {
margin-top: var(--page-gap);
}
}
@media (max-width: 991.98px) {
.app-topbar .tooltip,
div[role="tooltip"]:has(.tooltip-inner) {
display: none !important;
pointer-events: none !important;
}
}
@media (max-width: 991.98px) {
.app-topbar {
border-top: none;
left: 0;
width: 100%;
}
.app-topbar > .app-container {
padding-left: 0;
padding-right: 0;
}
.app-topbar-inner {
position: relative;
margin: 0;
border-top: 0;
border-left: 0;
border-right: 0;
border-radius: 0 !important;
border-bottom: 0.5px solid var(--border);
padding-left: 0 !important;
padding-right: 0 !important;
}
.app-topbar-inner > .d-flex.align-items-center.gap-2 {
gap: 2px !important; /* 8px → 4px */
}
.app-topbar-hamburger {
margin-left: var(--page-gap-mobile);
}
.app-topbar .btn-icon {
width: 32px;
height: 32px;
}
.app-topbar .btn-icon i {
font-size: 1.1rem;
}
}
@media (max-width: 991.98px) {
.app-topbar-mobile-logo {
display: flex;
align-items: center;
margin-left: 6px; /* hamburger ile logo arası */
}
.app-topbar-mobile-logo .logo-svg {
height: 24px; /* TOPBAR ölçüsüne uygun */
max-height: 24px;
width: auto;
}
}
.app-topbar .btn-icon:hover,
.app-topbar .btn-user:hover {
background-color: var(--app-primary-soft);
border-radius: var(--radius-sm);
}
.app-topbar .app-profile-btn:hover {
border-radius: 50%;
}
.app-topbar .btn-icon i,
.app-topbar .btn-user i {
transition: color 160ms ease, opacity 160ms ease;
}
.app-topbar .btn-icon:hover i,
.app-topbar .btn-user:hover i {
opacity: 1;
}
.app-topbar .btn-icon:active,
.app-topbar .btn-icon:focus,
.app-topbar .btn-icon:focus-visible,
.app-topbar .btn-user:active,
.app-topbar .btn-user:focus,
.app-topbar .btn-user:focus-visible {
background-color: transparent;
border-color: transparent;
box-shadow: none;
}
.offcanvas .app-sidebar-header {
justify-content: space-between;
}
.offcanvas .btn-icon:hover {
background-color: var(--app-primary-soft);
border-radius: var(--radius-sm);
}
.offcanvas .btn-icon:hover {
background-color: var(--surface-hover);
}
.app-topbar .btn-icon i,
.offcanvas .btn-icon i {
transition: transform 160ms ease, opacity 160ms ease;
}
.app-topbar .btn-icon:hover i,
.offcanvas .btn-icon:hover i {
opacity: 1;
}
.offcanvas .btn-icon i {
color: var(--icon-strong);
}
.app-breadcrumb {
width: 100%;
background: var(--bg);
--bs-breadcrumb-divider: "»";
--bs-breadcrumb-divider: "❯";
--bs-breadcrumb-divider: "→";
}
.app-breadcrumb-inner {
border-radius: var(--radius-surface);
border: 1px solid var(--border);
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
background: var(--surface); /* Topbar ile aynı arka plan */
box-shadow: var(--shadow); /* İsteğe bağlı: Aynı derinlik hissi için */
}
.app-breadcrumb-inner .breadcrumb {
background: transparent;
font-size: 0.8rem; /* default ~1rem */
line-height: 1.15;
margin: 0;
padding: 4px calc(var(--container-pad)); /* 🔥 ASIL HİZA */
justify-content: flex-end;
}
@media (max-width: 991.98px) {
.app-breadcrumb-inner .breadcrumb {
padding: 4px var(--container-pad); /* 2x → 1x */
}
.app-breadcrumb-inner .breadcrumb-item a {
padding: 0 0; /* 🔥 default hissi kır */
}
}
.app-breadcrumb-inner .breadcrumb-item.active {
color: inherit;
font-weight: inherit;
opacity: 0.85;
}
.app-breadcrumb-inner .breadcrumb-item.active a {
opacity: 1;
}
@media (max-width: 767.98px) {
.app-breadcrumb-inner .breadcrumb-item:not(.active) { display: none; }
.app-breadcrumb-inner .breadcrumb-item.active { padding-left: 0; }
.app-breadcrumb-inner .breadcrumb-item.active::before { content: none; }
}
.app-breadcrumb-inner a {
text-decoration: none;
color: var(--text);
}
.app-breadcrumb-inner a:hover {
color: var(--heading);
}
.app-breadcrumb-inner .breadcrumb-item {
padding: 0;
margin: 0;
font-size: 0.8rem;
}
.app-breadcrumb-inner .breadcrumb-item a i {
font-size: 0.8rem;
opacity: 0.65;
}
.app-breadcrumb-inner .breadcrumb-item a {
opacity: 0.65;
}
.app-breadcrumb-inner .breadcrumb-item + .breadcrumb-item::before {
padding: 0 3px;
margin: 0;
}
.app-breadcrumb-inner a:hover i {
opacity: 1;
}
@media (max-width: 991.98px) {
.app-breadcrumb {
border: none;
border-radius: 0 !important;
border-bottom: var(--shadow-inset-soft) !important;
}
.app-breadcrumb .app-container {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
max-width: 100% !important;
}
.app-breadcrumb-inner {
left: 0px !important;
border: none;
border-bottom: 0.5px solid var(--border);
border-radius: 0 !important;
}
}
@media (min-width: 992px) {
.app-breadcrumb-inner {
display: flex;
justify-content: flex-start;
}
.app-breadcrumb-inner .breadcrumb {
}
}
@media (max-width: 575.98px) {
.app-breadcrumb-inner .breadcrumb-item:not(:first-child):not(:last-child) {
display: none;
}
}
.app-search-wrap {
position: relative; /* 🔥 EN KRİTİK SATIR */
padding-left: 0 !important;
padding-right: 0 !important;
}
.app-search {
display: flex;
align-items: center;
gap: 10px;
background: var(--surface);
border: 1px solid transparent;
padding: 9px 4px;
}
@media (max-width: 991.98px) {
.app-search {
width: 32px;
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
}
.app-search:not(.open) .app-search-input {
position: absolute;
width: 0;
height: 0;
opacity: 0;
pointer-events: none;
}
.app-search:not(.open):hover {
background-color: var(--surface-hover);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
}
.app-search.open {
position: relative;
width: min(160px, calc(100vw - 220px)); /* 220 = hamburger + sağ ikonlar */
justify-content: flex-start;
padding-left: 12px;
cursor: text;
}
.app-search.open .app-search-input {
position: static;
width: 100%;
height: auto;
opacity: 1;
pointer-events: auto;
}
.app-topbar-inner > div:last-child {
flex-shrink: 0;
}
}
.app-search-icon {
opacity: 0.75;
font-size: 1.1rem;
}
.app-search-input {
border: 0;
outline: 0;
background: transparent;
width: 100%;
color: var(--heading);
}
.app-search-dd {
position: absolute;
border: 1px solid var(--border) !important;
box-shadow: var(--shadow) !important;
border-radius: var(--radius-surface) !important;
background: var(--surface) !important;
transform: none !important;
inset: auto !important;
top: calc(var(--app-breadcrumb-h) + var(--content-gap) + var(--app-topbar-h)) !important;
left: calc(-1*var(--container-pad)) !important;
width: calc(55vw - var(--container-pad)) !important;
max-width: none;
}
@media (max-width: 991.98px) {
.app-search-dd {
position: fixed !important;
top: calc(var(--app-topbar-h) + var(--app-breadcrumb-h) + var(--page-gap-mobile)) !important;
left: var(--page-gap-mobile) !important;
right: var(--page-gap-mobile) !important;
width: auto !important;
max-width: none;
}
}
.app-search-dd:empty {
display: none;
}
@media (max-width: 991.98px) {
.app-topbar-right {
gap: 2px !important;
margin-right: var(--page-gap-mobile);
}
.app-search-wrap {
position: absolute;
right: var(--tb-search-right, 140px);
top: 50%;
margin-top: calc(-32px / 2);
z-index: 5;
}
.app-search {
width: 32px;
height: 32px;
padding: 0;
justify-content: center;
cursor: pointer;
overflow: hidden;
transition: width 260ms cubic-bezier(.4,0,.2,1);
}
.app-search-input {
width: 0;
opacity: 0;
pointer-events: none;
transition: opacity 160ms ease
}
.app-search.open {
width: var(--tb-search-open, calc(100vw - 172px));
max-width: none;
padding: 0 12px;
justify-content: flex-start;
}
.app-search.open .app-search-input {
width: 100%;
opacity: 1;
pointer-events: auto;
}
.app-topbar-more {
position: relative;
z-index: 6;
}
}
.btn-ghost {
border: 1px solid transparent;
background: transparent;
color: var(--heading);
}
.btn-ghost:hover {
background: var(--bg);
border-color: var(--border);
}
.offcanvas .app-sidebar-header .btn-icon {
transform: translateY(6px); /* sadece X */
}
.btn-icon {
width: 32px;
height: 32px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
z-index: 10;
}
@media (min-width: 992px) {
.app-topbar-right,
.app-topbar-actions {
gap: 2px !important;
}
.app-topbar-actions .btn-icon,
.app-topbar-right > .btn-icon {
width: 34px; /* rozetli ziller köşede nefes alsın; yükseklik 32px sabit → satır boyu değişmez */
}
}
.btn-user {
background: transparent;
border: 1px solid transparent;
color: var(--heading);
padding: 6px 10px;
}
.btn-user:hover {
background: var(--bg);
border-color: var(--border);
}
.user-avatar {
width: 32px;
height: 32px;
border-radius: var(--radius-surface);
display: inline-flex;
align-items: center;
justify-content: center;
background: rgba(105, 108, 255, 0.16);
color: var(--heading);
font-weight: 700;
font-size: 12px;
}
.app-menu {
display: flex;
flex-direction: column;
gap: 2px;
}
.app-menu-item {
display: flex;
align-items: center;
gap: 12px;
padding: 6px var(--menu-p-x);
text-decoration: none;
color: var(--text);
background: transparent;
border: 1px solid transparent;
border-radius: var(--radius-sm);
box-sizing: border-box;
font-weight: 500;
transition: font-weight 160ms ease;
}
.app-menu-item:hover {
border-radius: var(--radius-sm) !important;
background-color: var(--surface-hover);
}
.app-menu-item.active {
color: var(--heading);
font-weight: 700;
}
.app-menu-item.active:not(.app-menu-toggle) {
background-color: var(--surface-hover);
border-radius: var(--radius-sm);
}
.app-menu-item.active .app-menu-ico {
color: var(--app-primary);
}
.app-menu-ico {
font-size: 18px;
width: 22px;
text-align: center;
opacity: 0.95;
}
.app-menu-item.is-locked,
.app-menu-sub-item.is-locked {
opacity: 0.55;
}
.app-menu-item.is-locked:hover,
.app-menu-sub-item.is-locked:hover {
opacity: 0.8;
}
.app-menu-sub-item.is-locked {
display: flex;
align-items: center;
}
.app-menu-lock {
margin-left: auto;
font-size: 12px;
color: var(--app-warning);
}
.mg-locked { opacity: .45; pointer-events: none; }
.app-menu-chevron {
margin-left: auto;
opacity: 0.6;
transition: transform 0.2s ease;
}
.app-menu-toggle[aria-expanded="true"] {
font-weight: 700;
color: var(--heading);
}
.app-menu-toggle[aria-expanded="true"] .app-menu-chevron {
transform: rotate(90deg);
}
.app-menu-toggle.has-active {
background-color: var(--surface-hover);
color: var(--heading);
}
.app-menu-sub {
margin-left: 22px;
padding-left: 0;
border-left: 2px solid var(--border);
display: flex;
flex-direction: column;
width: var(--submenu-w);
max-width: 100%;
}
.app-menu-sub-item {
margin-left: -2px;
padding: 3px 10px 3px 26px;
text-decoration: none;
color: var(--text);
border-left: 2px solid transparent;
border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
box-sizing: border-box;
}
.app-menu-sub-item:hover {
background-color: var(--surface-hover);
border-left-color: var(--surface-hover);
border-radius: 0;
color: var(--text-strong);
}
.app-menu-sub-item.active {
border-left-color: var(--app-primary);
color: var(--app-primary);
font-weight: 600;
}
.app-menu-sub-item.active .app-sub-ico {
color: var(--app-primary);
}
.app-menu-sub-item + .app-menu-sub-item {
margin-top: 0;
}
.app-menu-sub-item.disabled {
opacity: 0.4;
pointer-events: none;
cursor: default;
display: block;
}
.app-menu-divider {
height: 1px;
background: var(--border);
margin: 5px 10px;
}
.app-card {
border: 1px solid var(--border);
box-shadow: var(--shadow);
background: var(--surface);
}
.app-btn-primary {
background: var(--app-primary);
border-color: var(--app-primary);
}
.btn-primary {
--bs-btn-bg:                   var(--app-primary);
--bs-btn-border-color:         var(--app-primary);
--bs-btn-hover-bg:             var(--mg-primary-2);
--bs-btn-hover-border-color:   var(--mg-primary-2);
--bs-btn-active-bg:            var(--mg-primary-2);
--bs-btn-active-border-color:  var(--mg-primary-2);
--bs-btn-disabled-bg:          var(--app-primary);
--bs-btn-disabled-border-color:var(--app-primary);
--bs-btn-focus-shadow-rgb:     45, 106, 79;
}
.btn-warning {
--bs-btn-color:              #fff;
--bs-btn-bg:                 var(--app-warning);
--bs-btn-border-color:       var(--app-warning);
--bs-btn-hover-color:        #fff;
--bs-btn-hover-bg:           color-mix(in srgb, var(--app-warning) 85%, #000);
--bs-btn-hover-border-color: color-mix(in srgb, var(--app-warning) 85%, #000);
--bs-btn-active-bg:          color-mix(in srgb, var(--app-warning) 70%, #000);
--bs-btn-disabled-bg:        var(--app-warning);
--bs-btn-disabled-border-color: var(--app-warning);
}
.btn-outline-warning {
--bs-btn-color:              var(--app-warning);
--bs-btn-border-color:       var(--app-warning);
--bs-btn-hover-color:        #fff;
--bs-btn-hover-bg:           var(--app-warning);
--bs-btn-hover-border-color: var(--app-warning);
--bs-btn-active-color:       #fff;
--bs-btn-active-bg:          var(--app-warning);
--bs-btn-active-border-color:var(--app-warning);
}
.app-page-title h4 {
color: var(--heading);
font-weight: 700;
}
.app-dropdown {
background: var(--surface);
border: 1px solid var(--border);
box-shadow: var(--shadow);
}
.app-dropdown .dropdown-item {
border-radius: var(--radius-sm);
}
.app-dropdown .dropdown-item:hover,
.app-dropdown .dropdown-item:focus,
.app-dropdown .dropdown-item:active,
.app-dropdown .dropdown-item.active {
background-color: var(--surface-hover);
color: var(--heading);
}
.app-dropdown .dropdown-item.text-danger:hover,
.app-dropdown .dropdown-item.text-danger:focus,
.app-dropdown .dropdown-item.text-danger:active,
.app-dropdown .dropdown-item.text-danger.active {
background-color: rgba(220, 53, 69, .10);
color: #b02a37 !important;
}
[data-theme="dark"] .app-dropdown .dropdown-item.text-danger:hover,
[data-theme="dark"] .app-dropdown .dropdown-item.text-danger:focus,
[data-theme="dark"] .app-dropdown .dropdown-item.text-danger:active,
[data-theme="dark"] .app-dropdown .dropdown-item.text-danger.active {
background-color: rgba(248, 113, 113, .14);
color: #f87171 !important;
}
.app_toggle_section {
font-size: 12.5px;
letter-spacing: 0.8px;
font-weight: 700;
color: rgba(86, 106, 127, 0.75);
margin: 9px 12px 6px;
}
.app_toggle_section {
color: var(--text-soft);
}
.app-menu-item-pro {
border-color: var(--app-primary);
}
.app-menu-item-pro .app-menu-ico {
color: var(--app-primary);
opacity: 1;
}
.app-menu-text-col {
display: flex;
flex-direction: column;
min-width: 0;
}
.app-menu-item-pro .app-menu-text {
font-size: .7rem;
font-weight: 600;
text-transform: uppercase;
color: var(--app-primary);
}
.app-menu-subtext {
font-size: .78rem;
color: var(--text-soft);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.app-offcanvas {
width: var(--sidebar-w) !important;
max-width: 100%;
background: var(--surface);
}
.offcanvas .app-sidebar-header {
}
@media (max-width: 576px) {
.app-offcanvas {
width: min(var(--sidebar-w), 90vw) !important;
}
}
@media (max-width: 991.98px) {
.app-offcanvas .app-menu { gap: 0; }
.app-offcanvas .app-menu-item { padding-top: 3px; padding-bottom: 3px; }
.app-offcanvas .app-menu-sub-item { padding-top: 1px; padding-bottom: 1px; }
}
.app-menu-sub-item {
position: relative;
padding-left: 22px; /* dot için yer */
}
.app-menu-sub-item::before {
content: "";
position: absolute;
left: 6px;
top: 50%;
width: 6px;
height: 6px;
border-radius: 50%;
background: rgba(86, 106, 127, 0.35);
transform: translateY(-50%);
transition: background 160ms ease, transform 160ms ease;
}
.app-menu-sub-item:hover::before {
transform: translateY(-50%) scale(1.1);
background-color: var(--app-primary);
}
.app-menu-sub-item.active::before {
background: var(--app-primary);
}
.app-menu-sub-item::before {
background-color: var(--menu-disc);
}
.app-menu-sub-item:hover::before,
.app-menu-sub-item.active::before {
background-color: var(--menu-disc-active);
}
.app-menu-sub-item.has-ico { padding-left: 10px; display: flex; align-items: center; gap: 5px; }
.app-menu-sub-item.has-ico::before { display: none; }
.app-sub-ico { font-size: 13px; opacity: .65; flex-shrink: 0; }
.app-menu-sub-item.has-ico.active .app-sub-ico { color: var(--app-primary); opacity: 1; }
.app-sidebar-body::-webkit-scrollbar {
width: 6px;
}
.app-sidebar-body::-webkit-scrollbar-track {
background: transparent;
}
.app-sidebar-body::-webkit-scrollbar-thumb {
background-color: rgba(255, 255, 255, 0.25);
border-radius: var(--radius-surface);
}
.app-sidebar-body::-webkit-scrollbar-thumb:hover {
background-color: rgba(255, 255, 255, 0.45);
}
.app-sidebar-body {
scrollbar-width: thin;
scrollbar-color: rgba(255,255,255,0.35) transparent;
}
.app-breadcrumb-inner .breadcrumb-item + .breadcrumb-item::before {
color: var(--text-muted);
}
.app-profile-wrap {
position: relative;
}
.app-profile-dd {
width: var(--nb-panel-w);
min-width: var(--nb-panel-w);
padding: var(--dropdown-p-y) var(--dropdown-p-x);
inset: auto !important;
transform: none !important;
margin: 0 !important; /* BS [data-bs-popper] ~2px margin-top'unu sıfırla — zillerle aynı hizada başlasın */
background-color: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-surface);
box-shadow: var(--shadow);
position: fixed !important;
top: calc(var(--announcement-h) + var(--app-header-h)) !important;
left: auto !important;
right: var(--page-gap) !important;
}
@media (max-width: 991.98px) {
.app-profile-dd {
position: fixed !important;
top: calc(var(--announcement-h) + var(--app-header-h)) !important;
left: var(--page-gap-mobile) !important;
right: var(--page-gap-mobile) !important;
width: auto !important;
}
}
.app-profile-cap {
pointer-events: none;
}
.app-profile-cap .app-dropdown-close {
pointer-events: auto;
}
.app-profile-name {
font-size: .85rem;
font-weight: 600;
color: var(--heading);
line-height: 1.3;
}
.app-profile-role {
font-size: .73rem;
color: var(--text-muted);
margin-top: .1rem;
}
.app-profile-dd .dropdown-item {
color: var(--text);
border-radius: var(--radius-sm);
}
.app-profile-dd .dropdown-item:hover,
.app-profile-dd .dropdown-item:focus {
background-color: var(--surface-hover);
color: var(--heading);
}
.app-profile-dd .dropdown-divider {
border-color: var(--border);
}
.app-profile-logout {
width: 100%;
text-align: left;
color: #dc3545;
}
.app-profile-logout:hover { color: #b02a37; background-color: rgba(220,53,69,.08); }
[data-theme="dark"] .app-profile-dd {
background-color: var(--surface);
border-color: var(--border);
}
[data-theme="dark"] .app-profile-dd .dropdown-item {
color: var(--text);
}
[data-theme="dark"] .app-profile-dd .dropdown-item:hover,
[data-theme="dark"] .app-profile-dd .dropdown-item:focus {
background-color: var(--surface-hover);
color: var(--heading);
}
[data-theme="dark"] .app-profile-dd .dropdown-divider {
border-color: var(--border);
}
[data-theme="dark"] .app-profile-logout {
color: #f87171;
}
[data-theme="dark"] .app-profile-logout:hover {
color: #f87171;
background-color: rgba(220,53,69,.12);
}
.app-branch-dd {
min-width: 220px;
padding: var(--dropdown-p-y) var(--dropdown-p-x);
background-color: var(--surface);
border-color: var(--border);
border-radius: var(--radius-surface);
box-shadow: var(--mg-shadow-lg);
inset: auto !important;
transform: none !important;
}
.app-branch-dd .dropdown-item {
color: var(--text);
border-radius: var(--radius-sm);
margin-block: 2px;
}
.app-branch-dd .dropdown-item:hover,
.app-branch-dd .dropdown-item:focus {
background-color: var(--surface-hover);
color: var(--heading);
}
.app-branch-dd .dropdown-divider {
border-color: var(--border);
}
.app-branch-dd-cap {
font-size: .72rem;
font-weight: 600;
letter-spacing: .05em;
text-transform: uppercase;
color: var(--text-muted);
}
.bl-branch-active {
background-color: var(--app-primary-soft) !important;
color: var(--app-primary) !important;
}
[data-theme="dark"] .app-branch-dd {
background-color: var(--surface);
border-color: var(--border);
}
[data-theme="dark"] .app-branch-dd .dropdown-item {
color: var(--text);
}
[data-theme="dark"] .app-branch-dd .dropdown-item:hover,
[data-theme="dark"] .app-branch-dd .dropdown-item:focus {
background-color: var(--surface-hover);
color: var(--heading);
}
[data-theme="dark"] .app-branch-dd .dropdown-divider {
border-color: var(--border);
}
[data-theme="dark"] .bl-branch-active {
background-color: rgba(82, 183, 136, .15) !important;
color: #52B788 !important;
}
.app-topbar-more {
display: none;
}
@media (max-width: 991.98px) {
.app-topbar-actions {
display: none !important;
}
.app-topbar-more {
display: block;
position: static;
}
}
.app-topbar-more .dropdown-menu {
position: fixed !important;
top: calc(var(--app-topbar-h) + var(--app-breadcrumb-h) + var(--page-gap-mobile)) !important;
left: var(--page-gap-mobile) !important;
right: var(--page-gap-mobile) !important;
width: auto !important;
max-width: none !important;
padding: var(--dropdown-p-y) var(--dropdown-p-x);
background-color: var(--surface) !important;
color: var(--text) !important;
border: 1px solid var(--border) !important;
border-radius: var(--radius-surface);
box-shadow: var(--shadow);
visibility: hidden;
opacity: 0;
transition: all 0.25s cubic-bezier(.4,0,.2,1) !important;
overflow: visible !important;
}
.app-topbar-more .dropdown-menu.show {
visibility: visible;
opacity: 1;
transform: translateY(0) !important;
}
.app-topbar-more .dropdown-menu::before {
content: "";
position: absolute;
top: -8px;
right: 15px;
width: 15px;
height: 15px;
background-color: var(--surface);
border-left: 1px solid var(--border);
border-top: 1px solid var(--border);
border-top-left-radius: 3px;
transform: rotate(45deg);
z-index: -1;
}
.app-dropdown-cap {
display: none !important;
}
.app-topbar-more .dropdown-item:hover {
background-color: var(--surface-hover) !important;
color: var(--text-strong) !important;
border-radius: var(--radius-sm);
}
.app-badge {
background-color: var(--mg-primary);
color: #fff;
}
.app-topbar-more .dropdown-item {
color: var(--text) !important;
padding: var(--menu-p-y) var(--menu-p-x); /* 12px olan dikey padding'i 8px'e çektik */
display: flex;
align-items: center;
gap: var(--menu-gap); /* İkon ile yazı arasındaki 12px boşluğu 8px'e indirdik */
transition: background-color 0.2s;
font-size: 0.9rem; /* Yazıyı bir tık küçülterek ferahlık sağlayabilirsin */
}
.app-topbar-more .dropdown-item i {
color: var(--icon-strong);
font-size: 1.1rem;
width: 20px; /* İkonlara sabit genişlik vererek yazıları aynı hizaya çektik */
text-align: center;
}
.scroll-top-btn {
position: fixed;
right: var(--content-gap);
bottom: var(--content-gap); /*Desktop*/
width: 40px;
height: 40px;
border-radius: var(--radius-md);
background: var(--surface);
border: 1px solid var(--border);
box-shadow: var(--shadow-float);
color: var(--heading);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transform: translateY(12px);
pointer-events: none;
transition: opacity 300ms cubic-bezier(.4,0,.2,1), transform 360ms cubic-bezier(.4,0,.2,1), background-color 160ms ease, color 160ms ease;
}
body:has(.sticky-action-bar) .scroll-top-btn {
bottom: calc(
var(--page-gap)
+ var(--action-bar-h-actual, var(--action-bar-h-mobile))
+ var(--content-gap)
);
}
@media (max-width: 991.98px) {
.scroll-top-btn {
bottom: calc( var(--scroll-top-gap) + var(--mobile-footer-h) + env(safe-area-inset-bottom) ); /*Footerın üzerine binmesindiye..*/
z-index: 9999;
}
body:has(.sticky-action-bar) .scroll-top-btn {
bottom: calc(
var(--mobile-footer-h) + env(safe-area-inset-bottom)
+ var(--page-gap-mobile)
+ var(--action-bar-h-actual, var(--action-bar-h-mobile))
+ var(--page-gap-mobile)
);
}
}
.scroll-top-btn.show {
opacity: 0.8;
transform: translateY(0);
pointer-events: auto;
}
.scroll-top-btn i {
font-size: 17px; /* 18 → 17, ölçüyle uyumlu */
}
.scroll-top-btn.show {
transform: translateY(-2px);
}
.scroll-top-btn:hover {
background-color: var(--surface-hover);
color: var(--text-strong);
}
.app-mobile-footer {
height: calc(var(--mobile-footer-h) + env(safe-area-inset-bottom));
z-index: 1040;
padding-bottom: env(safe-area-inset-bottom);
padding-left: 6px;
padding-right: 6px;
background-color: var(--surface);
box-shadow: var(--shadow);
border-top: 0.5px solid var(--border);
}
.app-mobile-footer > .d-flex {
align-items: center;
}
.app-mobile-footer .footer-icon {
width: 36px !important;
height: 36px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
color: var(--text);
text-decoration: none;
border-radius: var(--radius-sm);
transition: background-color 120ms ease, color 120ms ease;
}
.app-mobile-footer .footer-icon i {
font-size: 17px;
line-height: 1;
}
.app-mobile-footer .footer-more {
}
.footer-label {
display: block;
font-size: 10px;
line-height: 1;
margin-top: 2px;
opacity: 0.55;
white-space: nowrap;
pointer-events: none;
}
@media (max-width: 360px) {
.app-mobile-footer .footer-label {
display: none;
}
}
.app-footer-sheet-item {
display: flex;
align-items: center;
gap: 4px;
}
.app-mobile-footer .footer-icon {
flex-direction: column;
height: auto; /* 🔴 KRİTİK */
padding-top: 4px;
padding-bottom: 4px;
}
.app-mobile-footer .footer-icon i {
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
}
.app-footer-sheet-item .footer-label {
opacity: 1; /* 🔥 muted iptal */
font-size: 0.9rem; /* sheet için normal */
}
.app-mobile-footer .footer-icon i {
border-radius: var(--radius-sm);
padding: 9px; /* ikon için hover alanı */
transition: background-color 120ms ease;
}
.app-mobile-footer .footer-icon:hover i,
.app-mobile-footer .footer-icon.active i {
background-color: var(--app-primary-soft);
}
.app-logo svg {
height: 30px;
width: auto;
display: block;
}
.logo-svg text {
font-family: Iceland, Iceland-Regular, sans-serif;
font-size: 100px;
letter-spacing: -0.05em;
}
.logo-tayin {
fill: var(--logo-primary);
}
.logo-rehberi {
fill: var(--logo-secondary);
}
@media (max-width: 991.98px) {
.app-offcanvas .app-brand-mark svg {
height: 30px;
width: auto;
max-height: 30px;
transform: translateY(6px); /* PNG boşluğu hissi */
}
}
.app-backdrop {
position: fixed;
inset: 0;
background: rgba(0,0,0,.35);
backdrop-filter: blur(4px);
opacity: 0;
pointer-events: none;
transition: opacity .25s ease;
z-index: 1040;
}
.app-backdrop.show {
opacity: 1;
pointer-events: auto;
}
.app-mobile-footer-sheet {
position: fixed;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
background: var(--surface, #fff);
border-top-left-radius: var(--radius-surface);
border-top-right-radius: var(--radius-surface);
transform: translateY(100%);
transition: transform .28s cubic-bezier(.2,.8,.2,1);
max-height: 70vh;
height: auto;
min-height: 0;
z-index: 1050;
padding-bottom: env(safe-area-inset-bottom);
padding: 8px 10px;
}
.app-mobile-footer-sheet.show {
transform: translateY(0);
}
.app-footer-sheet-handle {
position: relative;
display: block;
width: 40px;
height: 4px;
background: #cfcfcf;
border-radius: 2px;
margin: 10px auto 14px;
}
.app-footer-sheet-handle::before {
content: "";
position: absolute;
top: -14px;
bottom: -14px;
left: -60px;
right: -60px;
}
.app-footer-sheet-content {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
flex: 1 1 auto;
overflow-y: auto;
padding: 0 16px 16px;
min-height: 1px; /* iOS/WebKit fix */
}
#appFooterSheetContent {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
@media (max-width: 360px) {
#appFooterSheetContent {
grid-template-columns: 1fr;
}
}
.app-footer-sheet-item {
display: flex;
align-items: center;
gap: 4px;
padding: 6px;
border-radius: var(--radius-sm);
text-decoration: none;
color: inherit;
justify-content: flex-start;
}
.app-footer-sheet-item:hover {
background-color: var(--surface-hover);
}
.app-footer-sheet-item i {
width: 28px; /* 🔴 SABİT KUTU */
text-align: center;
font-size: 18px;
flex-shrink: 0;
}
.app-sidebar-body,
#searchItems,
.app-dropdown-scroll,
.app-footer-sheet-content {
scrollbar-width: thin; /* Firefox için ince görünüm */
scrollbar-color: var(--scrollbar-thumb) transparent;
}
.app-sidebar-body::-webkit-scrollbar,
#searchItems::-webkit-scrollbar,
.app-dropdown-scroll::-webkit-scrollbar,
.app-footer-sheet-content::-webkit-scrollbar {
width: 6px; /* İnce genişlik */
}
.app-sidebar-body::-webkit-scrollbar-track,
#searchItems::-webkit-scrollbar-track,
.app-dropdown-scroll::-webkit-scrollbar-track,
.app-footer-sheet-content::-webkit-scrollbar-track {
background: transparent; /* Arka plan temiz */
}
.app-sidebar-body::-webkit-scrollbar-thumb,
#searchItems::-webkit-scrollbar-thumb,
.app-dropdown-scroll::-webkit-scrollbar-thumb,
.app-footer-sheet-content::-webkit-scrollbar-thumb {
background-color: var(--scrollbar-thumb); /* Değişkeninden gelen renk */
border-radius: var(--radius-surface);
}
.app-sidebar-body::-webkit-scrollbar-thumb:hover,
#searchItems::-webkit-scrollbar-thumb:hover,
.app-dropdown-scroll::-webkit-scrollbar-thumb:hover,
.app-footer-sheet-content::-webkit-scrollbar-thumb:hover {
background-color: var(--scrollbar-thumb-hover); /* Hover durumundaki renk */
}
.modal-body {
scrollbar-width: thin;
scrollbar-color: var(--scrollbar-thumb) transparent;
}
.modal-body::-webkit-scrollbar              { width: 6px; }
.modal-body::-webkit-scrollbar-track        { background: transparent; }
.modal-body::-webkit-scrollbar-thumb        { background-color: var(--scrollbar-thumb); border-radius: var(--radius-surface); }
.modal-body::-webkit-scrollbar-thumb:hover  { background-color: var(--scrollbar-thumb-hover); }
.modal-dialog-scrollable > .modal-content > form {
display: flex;
flex-direction: column;
min-height: 0;
overflow: hidden;
}
@media (max-width: 991.98px) {
.dropdown-menu.app-dropdown-scroll {
max-height: min(65vh, 420px); /* az uzasın, sonra dursun */
overflow-y: auto !important;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.app-topbar-more .dropdown-menu.show {
visibility: visible;
opacity: 1;
pointer-events: auto;
transform: translateY(0) !important;
}
}
.app-menu-toggle {
justify-content: space-between;
}
.app-menu-ico {
min-width: 22px;
}
.app-sidebar-header .app-brand-mark {
display: flex;
align-items: center;
justify-content: center;
}
.offcanvas .bi-x-lg {
font-size: 1.15rem;
transform: scale(1.1);
}
.app-topbar .bi-three-dots,
.app-topbar .bi-three-dots-vertical {
}
* {
-webkit-tap-highlight-color: transparent;
}
.app-topbar .btn:focus,
.app-topbar a:focus,
.app-mobile-footer .footer-icon:focus,
.app-mobile-footer a:focus {
outline: none !important;
box-shadow: none !important;
}
.btn:active, .btn:focus {
outline: none !important;
box-shadow: none !important;
}
.app-topbar .bi-list {
font-size: 1.4rem !important; /* default ~1.25rem */
transform: scale(1.1) /*translateY(3px)*/; /* hafif bold hissi */
}
.search-results {
max-height: min(60vh, 420px);
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
padding: var(--menu-p-y) var(--menu-p-x); /* 8px 10px -> 8px 15px oldu */
}
.search-header,
.search-suggestions-title {
padding: var(--menu-p-y) var(--menu-p-x) !important;
margin-bottom: 6px;
font-size: inherit;
font-weight: 500;
color: var(--text-soft);
text-transform: none;
letter-spacing: normal;
border: none !important;
border-radius: var(--radius-surface);
background: var(--surface-hover);
}
.app-search-dd .dropdown-item {
display: block;
padding: 8px 10px;
border-radius: var(--radius-sm);
font-size: inherit; /* 🔥 SIDEBAR İLE AYNI */
font-weight: 400;
color: var(--text);
white-space: normal;
word-break: break-word;
}
.app-search-dd .dropdown-item:hover,
.app-search-dd .dropdown-item.active {
background-color: var(--surface-hover);
font-weight: 400;
}
.search-parent,
.search-title {
font-size: inherit; /* 🔥 SIDEBAR İLE AYNI */
font-weight: 400;
color: var(--text);
}
.search-sep {
margin: 0 6px;
opacity: 0.4;
}
.search-suggestions-title {
}
.search-highlight {
display: inline-block;
white-space: nowrap;
background-color: var(--surface-hover);
color: inherit;
border-radius: 3px;
box-shadow: 0 0 0 2px var(--surface-hover); /* padding hissi */
}
.search-row {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 6px;
font-size: inherit;
font-weight: 500;
color: var(--text-soft);
border-bottom: 1px solid var(--border);
}
.search-row.search-empty {
border-bottom: none;
margin-bottom: 0;
padding:0px;
}
.search-close {
background: none;
border: 0;
padding: 8px;
margin-left: 10px;
font-size: 14px;
line-height: 1;
cursor: pointer;
color: var(--text-soft);
border-radius: var(--radius-sm);
}
.search-close:hover {
background: var(--app-primary-soft);
color: var(--app-primary);
}
.app-search-dd .dropdown-item {
display: block;
padding: var(--menu-p-y) var(--menu-p-x); /* 8px 10px -> 8px 15px oldu */
border-radius: var(--radius-sm);
font-size: inherit;
font-weight: 400;
color: var(--text);
white-space: normal;
word-break: break-word;
}
.search-group-title {
margin-top: 10px;
color: var(--text-soft);
font-weight: 500;
border-bottom: 1px solid var(--border);
}
.search-group-title:first-child {
margin-top: 0;
}
.search-group-title .search-group-ico {
margin-right: 6px;
opacity: 0.7;
}
.app-search-dd .dropdown-item.search-result {
display: flex;
align-items: center;
gap: 8px;
}
.app-search-dd .dropdown-item.search-result.is-locked {
opacity: 0.55;
}
.app-search-dd .dropdown-item.search-result.is-locked:hover {
opacity: 0.8;
}
.search-item-ico {
flex: 0 0 auto;
opacity: 0.65;
}
.search-text {
flex: 1 1 auto;
min-width: 0;
}
.search-sub {
flex: 0 0 auto;
margin-left: auto;
padding-left: 8px;
color: var(--text-soft);
font-size: 0.85em;
white-space: nowrap;
}
.search-row.search-loading {
border-bottom: none;
color: var(--text-soft);
}
.modal-backdrop { z-index: 1101; }
.modal { z-index: 1102; }
.popover { z-index: 1103; }
.tooltip { z-index: 1103; }
.app-announcement {
position: fixed;
width: 100%;
height: var(--announcement-base-h);
z-index: 1100;
display: flex;
align-items: center;
gap: .75rem;
padding: 0 var(--page-gap) 0 1.25rem;
overflow: hidden;
transform: translateY(-100%);
transition: transform 240ms cubic-bezier(.4,0,.2,1);
background: var(--announcement-bg);
color: var(--announcement-text);
}
.app-announcement.ann-clr-success   { background: var(--ann-success-bg);   color: var(--ann-success-fg); }
.app-announcement.ann-clr-primary   { background: var(--ann-primary-bg);   color: var(--ann-primary-fg); }
.app-announcement.ann-clr-secondary { background: var(--ann-secondary-bg); color: var(--ann-secondary-fg); }
.app-announcement.ann-clr-info      { background: var(--ann-info-bg);      color: var(--ann-info-fg); }
.app-announcement.ann-clr-warning   { background: var(--ann-warning-bg);   color: var(--ann-warning-fg); }
.app-announcement.ann-clr-danger    { background: var(--ann-danger-bg);    color: var(--ann-danger-fg); }
.app-announcement.ann-clr-dark      { background: var(--ann-dark-bg);      color: var(--ann-dark-fg); }
.app-announcement.ann-clr-light     { background: var(--ann-light-bg);     color: var(--ann-light-fg); }
.app-announcement.ann-has-color {
background: var(--ann-custom-bg);
color: var(--ann-custom-text, #fff);
}
.announcement-text {
font-family: var(--announcement-font);
font-style: normal;
letter-spacing: .01em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
flex: 1;
min-width: 0;
text-align: left;
cursor: pointer;
}
.announcement-text strong {
font-weight: 600;
font-style: normal;
}
.announcement-msg {
font-weight: 400;
font-style: normal;
opacity: .85;
}
.announcement-actions {
display: flex;
align-items: center;
gap: .5rem;
flex: 0 0 auto;
}
.announcement-divider {
width: 1px;
height: 18px;
background: currentColor;
opacity: .3;
flex: 0 0 auto;
}
.announcement-view {
appearance: none;
background: transparent;
border: 0;
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: .3em;
font-family: var(--announcement-font);
font-weight: 600;
font-size: .92em;
color: inherit;
opacity: .95;
cursor: pointer;
white-space: nowrap;
padding: 6px 8px;
border-radius: var(--radius-sm);
transition: opacity 120ms ease, background-color 120ms ease;
}
.announcement-view i {
font-size: .85em;
}
@media (max-width: 991.98px) {
.app-announcement {
padding: 0 var(--page-gap-mobile) 0 calc(var(--page-gap-mobile) + 32px + 6px);
}
.announcement-msg {
display: none;
}
}
.announcement-close {
appearance: none;
background: transparent;
border: 0;
padding: 6px;
margin-right: -6px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
color: inherit;
opacity: 0.7;
cursor: pointer;
border-radius: var(--radius-sm);
transition: opacity 120ms ease, background-color 120ms ease;
}
.announcement-close i {
font-size: 22px;
line-height: 1;
}
.announcement-close:hover {
opacity: 1;
background-color: color-mix(in srgb, currentColor 15%, transparent);
}
body.has-announcement .app-announcement {
transform: translateY(0);
}
body.has-announcement {
--announcement-h: var(--announcement-measured, var(--announcement-base-h));
}
html.ann-dismissed body.has-announcement { --announcement-h: 0px; }
html.ann-dismissed .app-announcement {
transform: translateY(-100%) !important;
transition: none !important;
}
.announcement-close:focus,
.announcement-close:active,
.announcement-view:focus,
.announcement-view:active {
outline: none;
box-shadow: none;
}
@media (max-width: 991.98px) {
body.has-announcement {
--topbar-gap: 0px;
}
:root {
--topbar-gap: 0px;
--app-header-h: calc(var(--app-topbar-h) + var(--app-breadcrumb-h) + var(--page-gap-mobile));
}
}
.app-sidebar-profile { display:flex; align-items:center; gap:10px; padding:6px var(--menu-p-x); text-decoration:none; color:var(--text); transition:background .15s; border-radius:var(--radius-sm); }
.app-sidebar-profile:hover { background: var(--surface-hover); color: var(--text); }
.app-sidebar-profile-icon { font-size:1.25rem; color:var(--app-primary); flex-shrink:0; width:22px; text-align:center; }
.app-sidebar-profile-info { display:flex; flex-direction:column; min-width:0; }
.app-sidebar-profile-role { font-size:.7rem; font-weight:600; text-transform:uppercase; color:var(--app-primary); }
.app-sidebar-profile-name { font-size:.78rem; color:var(--text-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-sidebar-profile-divider { margin:4px var(--menu-p-x); border-color:var(--border); opacity:1; }
.app-menu-badge-soon { display:inline-flex; font-size:.6rem; font-weight:600; padding:1px 5px; border-radius:20px; background:color-mix(in srgb, var(--app-primary) 12%, transparent); color:var(--app-primary); }
.ms-nav-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; margin-left:auto; padding:0 5px; font-size:.62rem; font-weight:700; line-height:1; color:#fff; background:#dc3545; border-radius:20px; }
.app-bc-role { font-size:.7rem; font-weight:600; margin-left:4px; vertical-align:middle; }
.offcanvas.app-offcanvas {
top: var(--announcement-h);
}
.app-sidebar {
position: fixed;
top: var(--announcement-h);
height: calc(100vh - var(--announcement-h));
}
.announcement-emoji {
margin-right: .4em;
flex-shrink: 0;
}
.an-emoji-cell {
font-size: 1.1rem;
text-align: center;
line-height: 1;
}
.an-emoji-option {
display:     flex;
align-items: center;
gap:         .5em;
}
.an-emoji-icon {
font-size:   1.1rem;
line-height: 1;
flex-shrink: 0;
}
.an-emoji-label { color: var(--text); }
.app-avatar {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: var(--radius-full);
font-weight: 700;
line-height: 1;
flex-shrink: 0;
color: #ffffff;
user-select: none;
letter-spacing: .03em;
text-transform: uppercase;
}
.app-avatar-sm      { width: 22px; height: 22px; font-size: .55rem; }
.app-avatar-topbar  { width: 30px; height: 30px; font-size: .68rem; }
.app-avatar-md      { width: 36px; height: 36px; font-size: .78rem; }
.app-avatar-lg      { width: 52px; height: 52px; font-size: 1.05rem; }
.app-avatar-xl      { width: 64px; height: 64px; font-size: 1.3rem; border-radius: var(--radius-surface); }
[data-theme="dark"] .app-avatar {
box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
}
.an-char-count {
display: block;
text-align: right;
margin-top: .25rem;
font-size:  .72rem;
}
@media (min-width: 576px) {
.modal { --bs-modal-width: 560px; }                 /* varsayılan 500px → 560px */
.modal-dialog.modal-sm { --bs-modal-width: 430px; } /* onay modalları 300px → 430px */
}
.app-notification-modal .modal-content {
background: var(--modal-bg);
border: 1px solid var(--modal-border);
border-radius: var(--modal-radius);
box-shadow: var(--modal-shadow);
}
.app-modal-header {
position: relative;
border-bottom: 1px solid var(--border);
background: var(--modal-header-bg);
}
.app-modal-header .modal-title {
color: var(--modal-title-color);
font-weight: 700;
display: flex;
align-items: center;
}
.app-modal-body {
color: var(--modal-text-color);
line-height: 1.6;
font-size: 0.95rem;
}
.app-modal-footer {
border-top: 1px solid var(--border);
background: var(--modal-footer-bg);
}
.app-x,
.app-modal-close,
.info-strip-close,
.app-alert-close {
--app-x-size: 36px;
--app-x-font: 1.5rem;
flex-shrink: 0;
display: inline-flex;
align-items: center;
justify-content: center;
width: var(--app-x-size);
height: var(--app-x-size);
padding: 0;
border: 0;
background: transparent;
color: var(--text-muted);
border-radius: var(--radius-sm);
line-height: 1;
cursor: pointer;
transition: color .15s, background .15s;
}
.app-x > i,
.app-modal-close > i,
.info-strip-close > i,
.app-alert-close > i {
font-size: var(--app-x-font);
}
.app-x:hover,
.app-modal-close:hover,
.info-strip-close:hover,
.app-alert-close:hover {
color: var(--app-primary);
background: var(--app-primary-soft);
}
.app-x--sm { --app-x-size: 24px; --app-x-font: 1rem; }
.app-x--lg { --app-x-size: 40px; --app-x-font: 1.6rem; }
.app-modal-close {
position: absolute;
top: 10px;
right: 10px;
}
.alert-dismissible .app-alert-close {
position: absolute;
top: 8px;
right: 8px;
}
.app-info {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
padding: 0;
margin-left: .35rem;
border: none;
background: transparent;
color: var(--text-muted);
cursor: pointer;
vertical-align: middle;
line-height: 1;
}
.app-info:hover { color: var(--app-primary); }
.app-info-pop { max-width: 300px; }
.app-info-pop .popover-header { font-size: .82rem; font-weight: 700; }
.app-info-pop .popover-body { font-size: .78rem; line-height: 1.55; text-align: justify; }
.ms-tog {
width: 30px;
height: 17px;
border-radius: 999px;
background: var(--ms-tog-off);
border: none;
cursor: pointer;
position: relative;
transition: background .2s;
flex-shrink: 0;
margin-left: .45rem;
margin-top: 2px;
}
.ms-tog.on { background: var(--app-primary); }
.ms-tog::after {
content: '';
position: absolute;
top: 2px; left: 2px;
width: 13px; height: 13px;
border-radius: 50%;
background: #fff;
transition: left .2s;
box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.ms-tog.on::after { left: 15px;
}
.app-modal-footer .btn {
border-radius: var(--radius-sm);
box-shadow: none;
}
.btn.xls-btn { border-radius: var(--radius-sm); }
.btn.btn-list-back { border-radius: var(--radius-sm); }
.app-modal-footer .btn-secondary {
background: var(--surface);
border: 1px solid var(--border);
color: var(--text);
}
.app-modal-footer .btn-secondary:hover {
background-color: var(--surface-hover);
color: var(--text-strong);
}
.app-modal-footer .btn-primary {
background: var(--app-primary);
border-color: var(--app-primary);
}
.app-modal-footer .btn-primary:hover {
filter: brightness(0.95);
}
.info-strip {
display: flex;
align-items: center;
gap: .6rem;
padding: .7rem .9rem;
background: var(--app-primary-soft);
border: 1px solid color-mix(in srgb, var(--app-primary) 30%, var(--border));
border-radius: var(--radius-surface);
color: var(--text-soft);
font-size: .82rem;
line-height: 1.5;
margin-bottom: var(--page-gap);
transition: opacity .25s ease, transform .25s ease;
}
.info-strip--closing {
opacity: 0;
transform: translateY(-6px);
pointer-events: none;
}
.info-strip > i {
color: var(--app-primary);
font-size: 1rem;
margin-top: .1rem;
flex-shrink: 0;
}
.info-strip strong { color: var(--text); font-weight: 700; }
.info-strip-text { flex: 1; }
.info-strip a:not(.btn) {
color: var(--app-primary);
text-decoration: underline;
text-underline-offset: 2px;
font-weight: 600;
}
.info-strip a:not(.btn):hover { color: var(--app-primary); opacity: .8; }
@media (max-width: 991.98px) {
.info-strip { margin-bottom: var(--page-gap-mobile); }
}
.modal-header .btn-close {
display: none;
}
.modal-backdrop.show {
background-color: var(--modal-backdrop);
}
.modal:focus,
.modal-content:focus {
outline: none;
}
.app-loader {
position: fixed;
inset: 0;
background: var(--loader-bg);
display: flex;
align-items: center;
justify-content: center;
z-index: var(--loader-z);
opacity: 1;
transition: opacity var(--loader-fade);
}
.dot-loader {
display: flex;
gap: 6px;
}
.dot-loader span {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--app-primary, #277cb9);
animation: dotPulse 1.4s infinite ease-in-out both;
}
.dot-loader span:nth-child(1) {
animation-delay: -0.32s;
}
.dot-loader span:nth-child(2) {
animation-delay: -0.16s;
}
@keyframes dotPulse {
0%, 80%, 100% {
opacity: 0.3;
}
40% {
opacity: 1;
}
}
.mg-logo {
filter: brightness(0.58) saturate(1.15);
transition: filter .25s;
}
[data-theme="dark"] .mg-logo {
filter: none;
}
.app-toast-wrap .toast {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-surface);
box-shadow: 0 6px 24px rgba(0,0,0,.10), 0 1px 4px rgba(0,0,0,.06);
min-width: 300px;
max-width: 400px;
overflow: hidden;
padding: 0;
}
.app-toast-wrap .toast .app-toast-inner {
display: flex;
align-items: center;
gap: .75rem;
padding: .85rem 1rem;
}
.app-toast-wrap .toast .app-toast-icon {
font-size: 1.15rem;
flex-shrink: 0;
line-height: 1;
}
.app-toast-wrap .toast .app-toast-text {
flex: 1;
font-size: .875rem;
font-weight: 600;
color: var(--text);
line-height: 1.4;
}
.app-toast-wrap .toast .app-toast-close {
flex-shrink: 0;
opacity: .5;
}
.app-toast-wrap .toast .app-toast-close:hover { opacity: 1; }
.app-toast-wrap .toast.toast-success { border-left: 4px solid var(--app-primary); }
.app-toast-wrap .toast.toast-success .app-toast-icon { color: var(--app-primary); }
.app-toast-wrap .toast.toast-error   { border-left: 4px solid #dc3545; }
.app-toast-wrap .toast.toast-error .app-toast-icon   { color: #dc3545; }
.app-toast-wrap .toast.toast-warning { border-left: 4px solid var(--app-warning); }
.app-toast-wrap .toast.toast-warning .app-toast-icon { color: var(--app-warning); }
.app-toast-wrap .toast.toast-info    { border-left: 4px solid #0ea5e9; }
.app-toast-wrap .toast.toast-info .app-toast-icon    { color: #0ea5e9; }
.app-toast-wrap .toast-link { color: var(--app-warning); font-weight: 600; text-decoration: underline; }
.app-toast-wrap .toast-link:hover { opacity: .8; }
[data-theme="dark"] .app-toast-wrap .toast {
background: var(--surface);
border-color: var(--border);
}
[data-theme="dark"] .app-toast-wrap .toast .app-toast-close {
filter: invert(1) grayscale(1) brightness(2);
}
.app-toast-wrap {
position: fixed;
bottom: calc(var(--scroll-top-gap) + 50px);
right: var(--content-gap);
z-index: 9998;
display: flex;
flex-direction: column;
gap: var(--page-gap-mobile);
}
@media (max-width: 991.98px) {
.app-toast-wrap {
bottom: calc(var(--mobile-footer-h) + var(--page-gap-mobile) + env(safe-area-inset-bottom));
right: var(--page-gap-mobile);
left: var(--page-gap-mobile);
min-width: 0;
}
.app-toast-wrap .toast { max-width: 100%; }
}
[data-theme="dark"] .app-toast-wrap .btn-close {
filter: invert(1) grayscale(100%) brightness(200%);
opacity: 0.7;
}
[data-theme="dark"] .app-toast-wrap .btn-close:hover {
opacity: 1;
}
[data-theme="dark"] .app-toast-wrap .toast-header {
border-bottom-color: var(--border);
}
.dt-lbl {
display: block;
margin-bottom: 6px;
font-size: 13px;
font-weight: 500;
color: var(--text-muted);
}
.dt-range {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: nowrap;
}
.dt-range:has(.dt-field-group) { align-items: stretch; }
.dt-range > .dt-field-group {
display: flex;
flex-direction: column;
flex: 1 1 0;
min-width: 0;
}
.dt-range > .dt-field-group > .dt-lbl { margin-bottom: 4px; }
.dt-range > .dt-field-group > .dt-field { width: 100%; }
.dt-range:has(.dt-field-group) > .dt-sep {
display: flex;
align-items: center;
padding-top: calc(13px + 4px);
}
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
-webkit-appearance: none;
appearance: none;
width: 100%;
min-width: 0;            /* flex taşmasını keser */
max-width: 100%;
box-sizing: border-box;
min-height: calc(2.25rem + 2px);  /* site standart input boyu; boşken çökmesin */
line-height: 1.2;
}
input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value,
input[type="datetime-local"]::-webkit-date-and-time-value,
input[type="month"]::-webkit-date-and-time-value,
input[type="week"]::-webkit-date-and-time-value {
text-align: left;
min-width: 0;
margin: 0;
}
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit,
input[type="month"]::-webkit-datetime-edit,
input[type="week"]::-webkit-datetime-edit {
padding: 0;
min-width: 0;
flex: 1 1 auto;
overflow: hidden;
text-align: left;
line-height: 1.2;
}
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="time"]::-webkit-datetime-edit-fields-wrapper,
input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
input[type="month"]::-webkit-datetime-edit-fields-wrapper,
input[type="week"]::-webkit-datetime-edit-fields-wrapper {
justify-content: flex-start;
text-align: left;
padding: 0;
}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator {
margin-left: auto;
opacity: .55;
}
input[type="date"],
input[type="time"],
input[type="datetime-local"] {
min-width: 0;
}
.dt-field {
flex: 1 1 0;
min-width: 0;
width: auto;
max-width: 100%;
box-sizing: border-box;
padding: .5rem .75rem;
font-size: 1rem;
line-height: 1.5;
background-color: var(--mf-bg, #FFFFFF);
border: 1px solid var(--mf-border, #E2E2E2);
border-radius: var(--radius-form);
color: var(--mf-text, #111111);
transition: border-color .18s, box-shadow .18s;
}
.dt-field:focus {
outline: 0;
border-color: var(--mf-focus, #2D6A4F);
box-shadow: none;
}
.dt-field.is-invalid {
border-color: var(--bs-danger, #dc3545);
}
[data-theme="dark"] .dt-field {
color-scheme: dark;
background-color: var(--mf-bg, #2E2E33);
border-color: var(--mf-border, #333338);
color: var(--mf-text, #EDEDEC);
}
.dt-field::-webkit-clear-button,
.dt-field::-webkit-inner-spin-button { display: none; }
.dt-sep {
flex: 0 0 auto;
color: var(--text-muted);
}
@media (max-width: 575.98px) {
.dt-range--stack {
flex-direction: column;
align-items: stretch;
}
.dt-range--stack > .dt-field,
.dt-range--stack > .dt-field-group { flex: 1 1 auto; width: 100%; }
.dt-range--stack > .dt-field-group > .dt-field { width: 100%; }
.dt-range--stack > .dt-sep,
.dt-range--stack:has(.dt-field-group) > .dt-sep { display: none; }
}
.dt-info {
flex: 0 0 auto;
font-size: .9rem;
color: var(--text-muted);
cursor: default;
}
.dt-range--sm .dt-field {
padding: .35rem .5rem;
font-size: .8125rem;
}
.dt-msg {
display: none;
align-items: center;
gap: 5px;
margin-top: 6px;
font-size: 11.5px;
}
.dt-msg.is-info {
display: flex;
color: var(--text-muted);
}
.dt-msg.is-err {
display: flex;
color: var(--bs-danger, #dc3545);
}
.dt-floating-row {
display: flex;
gap: 1rem;
}
.dt-floating-row > .form-floating {
flex: 1 1 0;
min-width: 0;
}
@media (max-width: 575.98px) {
.dt-floating-row { flex-direction: column; gap: .75rem; }
}
@media (max-width: 991.98px) {
body .mf-card,
body .bp-op-card {
padding: var(--card-pad-mobile);
}
}
.collapse-card {
background:     var(--mf-card);
border:        1px solid var(--border);
border-radius: var(--radius-surface);
box-shadow:    0 1px 4px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05);
}
[data-theme="dark"] .collapse-card {
background:    #242428;
border-color:  #333338;
box-shadow:    0 1px 4px rgba(0,0,0,.3), 0 1px 2px rgba(0,0,0,.2);
}
.collapse-card-hdr {
display:         flex;
align-items:     center;
justify-content: space-between;
width:           100%;
padding:         .9rem 1.4rem;
background:      none;
border:          none;
color:           var(--mf-text);
font-size:       .88rem;
font-weight:     500;
cursor:          pointer;
text-align:      left;
border-radius:   var(--radius-surface);
}
[data-theme="dark"] .collapse-card-hdr { color: #EDEDEC; }
.collapse-card-chevron {
font-size:   .75rem;
opacity:     .45;
flex-shrink: 0;
transition:  transform .25s cubic-bezier(.4,0,.2,1);
}
.collapse-card-hdr[aria-expanded="true"] .collapse-card-chevron { transform: rotate(180deg); }
.collapse-card-body { padding: 0 1.4rem 1.4rem; }
@media (max-width: 991.98px) {
.collapse-card-hdr  { padding: .9rem var(--card-pad-mobile); }
.collapse-card-body { padding: 0 var(--card-pad-mobile) var(--card-pad-mobile); }
}
.chip-group { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip-group--fill .chip { flex: 1 1 0; min-width: 0; }
@media (max-width: 575.98px) {
.chip-group--grid2 { display: grid; grid-template-columns: 1fr 1fr; }
}
@media (max-width: 575.98px) {
.chip-group--lead { display: grid; grid-template-columns: 1fr 1fr; }
.chip-group--lead > :first-child { grid-column: 1 / -1; }
}
.chip {
--chip-accent:      var(--app-primary);
--chip-accent-soft: var(--app-primary-soft);
display: inline-flex;
align-items: center;
justify-content: center;
gap: .3rem;
padding: .3rem .8rem;
font-size: .78rem;
font-weight: 500;
line-height: 1.4;
white-space: nowrap;
border: 1.5px solid var(--border);
border-radius: var(--radius-full);
background: transparent;
color: var(--text-muted);
cursor: pointer;
user-select: none;
transition: border-color .15s, background-color .15s, color .15s;
}
.chip .bi { font-size: .85rem; }
.chip:hover {
border-color: var(--chip-accent);
color:        var(--chip-accent);
}
.chip.is-on {
border-color: var(--chip-accent);
background:   var(--chip-accent-soft);
color:        var(--chip-accent);
font-weight:  600;
}
.chip--success { --chip-accent: var(--chip-success); --chip-accent-soft: var(--chip-success-soft); }
.chip--warn    { --chip-accent: var(--chip-warn);    --chip-accent-soft: var(--chip-warn-soft); }
.chip--danger  { --chip-accent: var(--chip-danger);  --chip-accent-soft: var(--chip-danger-soft); }
.chip--solid.is-on {
background: var(--chip-accent);
color:      var(--chip-on-accent);
}
.chip--solid.is-on .bi { color: var(--chip-on-accent); }
.tagify {
width: 100% !important;
height: auto !important;
align-content: flex-start;
border-radius: var(--radius-form);
background: var(--surface);
--tags-border-color:       var(--border);
--tags-hover-border-color: var(--app-primary);
--tags-focus-border-color: var(--app-primary);
--tag-text-color:          var(--text);
--tag-remove-btn-color:    var(--text-muted);
--input-color:             var(--text);
--placeholder-color:       var(--text-muted);
}
.tagify.tagify--focus {
border-color: var(--app-primary);
box-shadow:   none;
}
[data-theme="dark"] .tagify {
--tag-bg:               rgba(82,183,136,.15);
--tag-hover:            rgba(82,183,136,.25);
--tag-remove-bg:        rgba(239,68,68,.35);
--tag-remove-btn-color: #f87171;
background:             var(--surface-2);
}
[data-theme="dark"] .mf-card .tagify { background: var(--surface); }
.tagify-float { position: relative; }
.tagify-float .tagify {
display:    block;
width:      100%;
min-height: calc(3.5rem + 2px);
padding:    1.625rem .75rem .625rem;
}
.tagify-float .tagify__input { line-height: 1.5; vertical-align: middle; min-height: 1.5em; }
.tagify-float tag { vertical-align: middle; margin: 2px 4px 2px 0; }
.tagify-float > label {
position:         absolute;
top:              0;
left:             0;
height:           100%;
margin:           0;
padding:          1rem .75rem;
pointer-events:   none;
transform-origin: 0 0;
transition:       opacity .1s ease-in-out, transform .1s ease-in-out, color .1s;
color:            var(--text-muted);
white-space:      nowrap;
overflow:         hidden;
text-overflow:    ellipsis;
}
.tagify-float > label::after {
position:         absolute;
inset:            1rem .375rem;
z-index:          -1;
height:           1.5em;
content:          '';
background-color: var(--surface);
border-radius:    var(--radius-form);
}
.tagify-float .tagify.tagify--focus ~ label,
.tagify-float .tagify:has(tag) ~ label {
opacity:   .65;
transform: scale(.85) translateY(-.5rem) translateX(.15rem);
color:     var(--app-primary);
}
[data-theme="dark"] .tagify-float > label              { color: rgba(237,237,236,.45); }
[data-theme="dark"] .tagify-float > label::after       { background-color: var(--surface-2); }
[data-theme="dark"] .mf-card .tagify-float > label::after { background-color: var(--surface); }
.btn-outline-primary {
--bs-btn-color:              var(--app-primary);
--bs-btn-border-color:       var(--app-primary);
--bs-btn-hover-bg:           var(--app-primary);
--bs-btn-hover-border-color: var(--app-primary);
--bs-btn-active-bg:          var(--mg-primary-2);
--bs-btn-active-border-color:var(--mg-primary-2);
--bs-btn-focus-shadow-rgb:   45, 106, 79;
--bs-btn-disabled-color:       var(--app-primary);
--bs-btn-disabled-border-color:var(--app-primary);
}
.form-check-input:checked {
background-color: var(--app-primary);
border-color: var(--app-primary);
}
.form-check-input[type="checkbox"]:indeterminate {
background-color: var(--app-primary);
border-color: var(--app-primary);
}
.form-check-input:focus {
border-color: var(--app-primary);
box-shadow: none;
outline: none;
}
[data-theme="dark"] .form-check-input {
--bs-form-check-bg: var(--surface-2);
border-color: var(--border);
background-color: var(--surface-2);
}
[data-theme="dark"] .form-check-input:checked {
--bs-form-check-bg: var(--app-primary);
background-color: var(--app-primary);
border-color: var(--app-primary);
}
[data-theme="dark"] .form-check-input:indeterminate {
--bs-form-check-bg: var(--app-primary);
background-color: var(--app-primary);
border-color: var(--app-primary);
}
[data-theme="dark"] .form-check-input:focus {
border-color: var(--app-primary);
box-shadow: none;
}
.bulk-check {
margin:      0;
cursor:      pointer;
line-height: 0;
}
.bulk-check input {
position: absolute;
opacity:  0;
width:    0;
height:   0;
}
.bulk-box {
display:         inline-flex;
align-items:     center;
justify-content: center;
width:           22px;
height:          22px;
border-radius:   var(--radius-sm);
background:      rgba(255,255,255,.85);
border:          1px solid var(--app-primary);
color:           transparent;
font-size:       .82rem;
box-shadow:      0 1px 3px rgba(0,0,0,.20);
transition:      background .15s, color .15s, border-color .15s;
}
.bulk-check input:checked + .bulk-box {
background:   var(--app-primary);
border-color: var(--app-primary);
color:        #fff;
}
.bulk-check input:focus-visible + .bulk-box {
outline:        2px solid var(--app-primary);
outline-offset: 2px;
}
[data-theme="dark"] .bulk-box { background: rgba(20,20,22,.72); }
[data-theme="dark"] .bulk-check input:checked + .bulk-box { color: #111; }
.bulk-selected {
outline:        2px solid var(--app-primary);
outline-offset: -2px;
}
.bulk-bar {
display:       flex;
align-items:   center;
gap:           12px;
flex-wrap:     wrap;
padding:       8px 12px;
min-height:    54px;
margin-bottom: 1rem;
border:        1px solid var(--border);
border-radius: var(--radius-sm);
background:    var(--surface);
transition:    background .15s, border-color .15s;
}
.bulk-bar.is-active {
border-color: var(--app-primary);
background:   var(--app-primary-soft);
}
.bulk-select-all {
display:     inline-flex;
align-items: center;
gap:         7px;
margin:      0;
font-size:   .82rem;
font-weight: 600;
color:       var(--text-soft);
cursor:      pointer;
user-select: none;
}
.bulk-select-all input {
margin: 0;
cursor: pointer;
}
.bulk-count { font-size: .8rem; color: var(--text-muted); }
.bulk-count strong { color: var(--text); }
.bulk-actions {
display:     inline-flex;
align-items: center;
gap:         6px;
flex-wrap:   wrap;
margin-left: auto;
}
.bulk-divider {
align-self: stretch;
width:      1px;
background: var(--border);
}
.bulk-actions .dropdown-item { color: var(--text); }
.bulk-actions .dropdown-item:hover,
.bulk-actions .dropdown-item:focus {
background-color: var(--surface-hover);
color:            var(--app-primary);
}
@media (max-width: 575px) {
.bulk-bar.is-active .bulk-select-all { flex: 1 0 100%; }
.bulk-bar .bulk-divider { display: none; }
}
.popover {
--bs-popover-bg:            var(--surface);
--bs-popover-border-color:  var(--border);
--bs-popover-body-color:    var(--text);
--bs-popover-header-bg:     var(--surface-2);
--bs-popover-header-color:  var(--heading);
--bs-popover-border-radius: var(--radius-sm);
font-size: .78rem;
min-width: unset;
}
.popover-body { padding: .35rem .65rem; }
[data-theme="dark"] .popover {
--bs-popover-bg:            #2E2E33;
--bs-popover-border-color:  #333338;
--bs-popover-body-color:    #EDEDEC;
--bs-popover-header-bg:     #242428;
--bs-popover-header-color:  #EDEDEC;
}
[data-theme="dark"] .popover-arrow::before { border-top-color: #333338 !important; border-bottom-color: #333338 !important; }
[data-theme="dark"] .popover-arrow::after  { border-top-color: #2E2E33 !important; border-bottom-color: #2E2E33 !important; }
.tooltip-inner {
background-color: var(--surface-2);
color: var(--text);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
font-size: .75rem;
padding: .25rem .55rem;
}
.tooltip .tooltip-arrow::before { border-top-color: var(--border) !important; border-bottom-color: var(--border) !important; }
[data-theme="dark"] .tooltip-inner { background-color: #2E2E33; border-color: #333338; color: #EDEDEC; }
[data-theme="dark"] .tooltip .tooltip-arrow::before { border-top-color: #333338 !important; border-bottom-color: #333338 !important; }
.alert {
--bs-alert-margin-bottom: var(--page-gap);
--bs-alert-border-radius: var(--radius-surface);
}
@media (max-width: 991.98px) {
.alert { --bs-alert-margin-bottom: var(--page-gap-mobile); }
}
.alert-success {
--bs-alert-color:        var(--app-primary);
--bs-alert-bg:           var(--app-primary-soft);
--bs-alert-border-color: color-mix(in srgb, var(--app-primary) 35%, transparent);
--bs-alert-link-color:   var(--app-primary);
}
.alert-danger {
--bs-alert-color:        #dc3545;
--bs-alert-bg:           rgba(220,53,69,.08);
--bs-alert-border-color: rgba(220,53,69,.25);
--bs-alert-link-color:   #dc3545;
}
.alert-warning {
--bs-alert-color:        var(--app-warning);
--bs-alert-bg:           rgba(217,119,6,.08);
--bs-alert-border-color: rgba(217,119,6,.3);
--bs-alert-link-color:   var(--app-warning);
}
.alert-info {
--bs-alert-color:        #0ea5e9;
--bs-alert-bg:           rgba(14,165,233,.08);
--bs-alert-border-color: rgba(14,165,233,.25);
--bs-alert-link-color:   #0ea5e9;
}
[data-theme="dark"] .alert-danger  { --bs-alert-bg: rgba(220,53,69,.12); }
[data-theme="dark"] .alert-warning { --bs-alert-bg: rgba(251,191,36,.1); }
[data-theme="dark"] .alert-info    { --bs-alert-bg: rgba(14,165,233,.1); }
.app-topbar-inner > div:last-child {
flex-shrink: 0;
}
.app-search-wrap {
flex-shrink: 1;
min-width: 0;
}
.d-contents { display: contents; }
.pill-aktif   { background: var(--app-primary-soft); color: var(--app-primary); font-weight: 600; }
.pill-marka   { background: var(--app-primary-soft); color: var(--app-primary); font-weight: 600; }
.pill-pasif   { background: var(--surface-2); color: var(--text-muted); font-weight: 600; border: 1px solid var(--border); }
.pill-notr    { background: var(--surface-2); color: var(--text);       font-weight: 600; border: 1px solid var(--border); }
.pill-mevcut  { background: rgba(34,197,94,.1);  color: #16a34a; font-weight: 600; }
.pill-sinirli { background: rgba(234,179,8,.1);  color: #b45309; font-weight: 600; }
.pill-tukendi { background: rgba(239,68,68,.1);  color: #dc2626; font-weight: 600; }
.pill-info    { background: rgba(29,115,236,.12); color: #1D73EC; font-weight: 600; }
.pill-uyari   { background: rgba(245,124,0,.12);  color: #F57C00; font-weight: 600; }
.pill-mor     { background: rgba(111,66,193,.12); color: #6F42C1; font-weight: 600; }
.pill-success { background: rgba(34,197,94,.1);   color: #16a34a; font-weight: 600; }
.pill-danger  { background: rgba(239,68,68,.1);   color: #dc2626; font-weight: 600; }
.pill-toggle  { cursor: pointer; user-select: none; transition: opacity .15s; }
.pill-toggle:hover { opacity: .7; }
html[data-theme="dark"] .pill-pasif   { background: var(--surface-2); border-color: var(--border); color: rgba(237,237,236,.5); }
html[data-theme="dark"] .pill-notr    { background: var(--surface-2); border-color: var(--border); color: rgba(237,237,236,.85); }
html[data-theme="dark"] .pill-mevcut  { background: rgba(82,183,136,.15); color: #52B788; }
html[data-theme="dark"] .pill-sinirli { background: rgba(234,179,8,.12);  color: #fbbf24; }
html[data-theme="dark"] .pill-tukendi { background: rgba(239,68,68,.12);  color: #f87171; }
html[data-theme="dark"] .pill-info    { background: rgba(96,165,250,.15); color: #60A5FA; }
html[data-theme="dark"] .pill-uyari   { background: rgba(251,191,36,.15); color: #FBBF24; }
html[data-theme="dark"] .pill-mor     { background: rgba(167,139,250,.16); color: #A78BFA; }
html[data-theme="dark"] .pill-success { background: rgba(82,183,136,.15); color: #52B788; }
html[data-theme="dark"] .pill-danger  { background: rgba(239,68,68,.12);  color: #f87171; }
.editable-hint {
cursor: text;
border-radius: 2px;
transition: background-color .15s;
}
.editable-hint:hover,
.editable-hint:focus { background-color: var(--editable-hint-bg); }
@media (hover: none) {
.editable-hint { background-color: var(--editable-hint-bg); }
}
.h-scroll-fade {
flex-wrap: nowrap;
max-width: 100%;
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
--scroll-fade-size: 30px;
--hsf-l: 0px;
--hsf-r: 0px;
-webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--hsf-l), #000 calc(100% - var(--hsf-r)), transparent 100%);
mask-image: linear-gradient(to right, transparent 0, #000 var(--hsf-l), #000 calc(100% - var(--hsf-r)), transparent 100%);
}
.h-scroll-fade.hsf-l { --hsf-l: var(--scroll-fade-size); }
.h-scroll-fade.hsf-r { --hsf-r: var(--scroll-fade-size); }
.h-scroll-fade::-webkit-scrollbar { display: none; }
.h-scroll-fade > * { flex: 0 0 auto; }
.h-scroll-fade > :last-child { margin-right: var(--scroll-fade-size); }
.hs-tabs {
gap: var(--menu-gap);
}
.hs-tabs .nav-link {
white-space: nowrap;
color: var(--text-soft);
font-size: .82rem;
font-weight: 500;
padding: .45rem .9rem;
border: 1px solid var(--border);
transition: color .15s, background-color .15s, border-color .15s;
}
.hs-tabs .nav-link:hover:not(.active) {
color: var(--text);
background-color: var(--surface-2);
border-color: var(--mg-primary);
}
.hs-tabs .nav-link.active {
background-color: var(--mg-primary);
color: #fff;
font-weight: 600;
border-color: transparent;
}
[data-theme="dark"] .hs-tabs .nav-link                    { color: rgba(237,237,236,.55); }
[data-theme="dark"] .hs-tabs .nav-link:hover:not(.active) { color: #EDEDEC; background-color: #333338; border-color: #52B788; }
[data-theme="dark"] .hs-tabs .nav-link.active             { background-color: #52B788; color: #111; }
.hs-tabs-card {
padding: .85rem;
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-surface);
box-shadow: var(--shadow);
}
@media (max-width: 991.98px) {
.hs-tabs-card { padding: .4rem; }
}
.h-scroll-sticky {
position: sticky;
top: calc(var(--announcement-h) + var(--app-header-h));
z-index: 1010;
background: transparent;
padding-bottom: var(--page-gap);
}
@media (max-width: 991.98px) {
.h-scroll-sticky { padding-bottom: var(--page-gap-mobile); }
}
.h-scroll-sticky > .nf-stats-card,
.h-scroll-sticky > .el-stats-card,
.h-scroll-sticky > .hs-tabs-card,
.h-scroll-sticky > .rf-card,
.h-scroll-sticky > .lf-filter,
.h-scroll-sticky > .lt-actions { margin-bottom: 0; }