/* Scheduler Styles */
.scheduler-table td { position: relative; min-width: 150px; }

.appointment-card {
    border-radius: 6px;
    border-left: 4px solid rgba(0,0,0,0.3) !important;
    padding: 6px;
    cursor: pointer;
    overflow: hidden;
    transition: all 0.2s ease-in-out;
    font-size: 11px;
}

/* Hover Efekti: Genişleyip Detay Gösterme */
.appointment-card:hover {
    z-index: 100 !important;
    transform: scale(1.03);
    box-shadow: 0 10px 15px rgba(0,0,0,0.1) !important;
    height: auto !important;
    min-height: 80px;
}

.appointment-card .app-detail {
    display: none;
}

.appointment-card:hover .app-detail {
    display: block;
    margin-top: 4px;
    border-top: 1px solid rgba(255,255,255,0.2);
    padding-top: 4px;
}

/* Durum Gölgeleri */
.shadow-blue { box-shadow: 0 4px 6px rgba(13, 110, 253, 0.2); }
.shadow-green { box-shadow: 0 4px 6px rgba(25, 135, 84, 0.2); }

.service-extra-accordion {
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.service-extra-accordion .accordion-button {
    min-height: 46px;
    padding: 12px 16px;
    background: #fff;
    box-shadow: none;
}

.service-extra-accordion .accordion-button:not(.collapsed) {
    background: #f8fbff;
}

.service-extra-accordion .accordion-body {
    background: #fff;
}

/* Dashboard Status Dropdown */
.dashboard-status-dropdown .dropdown-toggle {
    border-radius: 8px;
    font-size: 12.5px;
    background-color: #fff;
}

.dashboard-status-dropdown .dropdown-menu {
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12) !important;
}

.dashboard-status-dropdown .dropdown-item {
    font-size: 12.5px;
    transition: background-color 0.15s ease-in-out;
}

.dashboard-status-dropdown .dropdown-item:hover {
    background-color: #f1f5f9;
}

.dashboard-status-dropdown .dropdown-item.active {
    background-color: #e0f2fe;
    color: #0369a1;
}

/* Map Modal */
#modalServiceMap .modal-body {
    background-color: #f8fafc;
}

#serviceMapContainer {
    z-index: 1;
}

/* Service Card Hover */
.service-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.08) !important;
}

/* Service operations command center */
#dashboardArea {
    --service-ink: #102a43;
    --service-slate: #52616b;
    --service-sky: #0ea5a7;
    --service-sky-deep: #087f8c;
    --service-surface: #f5f8fa;
    background:
        radial-gradient(circle at 6% 2%, rgba(14,165,167,.12), transparent 24rem),
        radial-gradient(circle at 95% 22%, rgba(37,99,235,.1), transparent 25rem);
    padding-bottom: 2rem;
}

.service-command-center {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    min-height: 176px;
    padding: 1.8rem 2rem;
    border-radius: 24px;
    color: #fff;
    background:
        radial-gradient(circle at 94% 8%, rgba(92, 225, 230, .34), transparent 20rem),
        linear-gradient(125deg, #102a43 0%, #145b70 52%, #087f8c 100%);
    box-shadow: 0 22px 46px rgba(16, 42, 67, .2);
}

.service-command-center::before,
.service-command-center::after {
    content: '';
    position: absolute;
    width: 18rem;
    height: 18rem;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 50%;
    pointer-events: none;
}

.service-command-center::before { right: -7rem; bottom: -13rem; }
.service-command-center::after { right: 15rem; top: -14rem; }
.service-command-copy, .service-command-metrics { position: relative; z-index: 1; }
.service-command-copy { max-width: 43rem; }
.service-command-eyebrow { display: inline-flex; align-items: center; gap: .5rem; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #bff4f5; }
.service-command-center h1 { margin: .5rem 0; color: #fff; font-size: clamp(1.55rem, 2.5vw, 2.35rem); font-weight: 800; letter-spacing: -.045em; }
.service-command-center p { max-width: 34rem; margin: 0; color: rgba(255,255,255,.78); font-size: .93rem; }
.service-command-period { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1rem; padding: .45rem .7rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(2, 30, 43, .18); font-size: .76rem; font-weight: 700; }
.service-command-metrics { display: grid; grid-template-columns: repeat(3, minmax(88px, 1fr)); gap: .65rem; min-width: 325px; }
.service-command-metric { padding: .85rem .8rem; border: 1px solid rgba(255,255,255,.15); border-radius: 16px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.service-command-metric span { display: block; min-height: 2.1em; color: rgba(255,255,255,.72); font-size: .69rem; font-weight: 700; line-height: 1.1; }
.service-command-metric strong { display: block; margin-top: .4rem; font-size: 1.55rem; line-height: 1; }
.service-command-metric-alert { background: rgba(244, 114, 94, .19); }

.service-control-deck { border-radius: 18px; box-shadow: 0 14px 30px rgba(16, 42, 67, .09); }
.service-control-deck .card-body { padding: .75rem !important; }
.service-control-deck .form-select, .service-control-deck .form-control, .service-control-deck .input-group-text { border-color: #e4edf0; background-color: #f8fbfc !important; }
.service-control-deck .form-control:focus, .service-control-deck .form-select:focus { border-color: #65c6c8; box-shadow: 0 0 0 .2rem rgba(14,165,167,.12); }
.dashboard-view-switch { box-shadow: none !important; background: #edf5f6 !important; }
.dashboard-view-switch .active { background: var(--service-sky-deep) !important; }

.service-kpi-card { overflow: hidden; border-radius: 18px; background: #fff; box-shadow: 0 12px 26px rgba(16,42,67,.075); transition: transform .22s ease, box-shadow .22s ease; }
.service-kpi-card:hover { transform: translateY(-3px); box-shadow: 0 18px 32px rgba(16,42,67,.12); }
.service-kpi-icon { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 14px; font-size: 1rem; }
.service-kpi-card .small { color: var(--service-slate) !important; font-size: .68rem; letter-spacing: .055em; text-transform: uppercase; }
.service-kpi-card .h5 { color: var(--service-ink); font-size: 1.45rem; }
.service-kpi-primary .service-kpi-icon { color: #1d4ed8; background: #dbeafe; }
.service-kpi-info .service-kpi-icon { color: #087f8c; background: #ccfbf1; }
.service-kpi-warning .service-kpi-icon { color: #b45309; background: #fef3c7; }
.service-kpi-danger .service-kpi-icon { color: #be123c; background: #ffe4e6; }
.service-kpi-dark .service-kpi-icon { color: #334155; background: #e2e8f0; }

.service-card { overflow: hidden; border-radius: 18px; box-shadow: 0 12px 28px rgba(16,42,67,.075) !important; transition: transform .22s ease, box-shadow .22s ease !important; }
.service-card:hover { transform: translateY(-5px); box-shadow: 0 22px 38px rgba(16,42,67,.14) !important; }
.service-card .card-body { padding: 1.15rem; }
.service-card .card-footer { padding: 0 1.15rem 1.1rem !important; }
.service-queue-card { overflow: hidden; border-radius: 18px; box-shadow: 0 12px 28px rgba(16,42,67,.075) !important; }
.service-queue-card .card-header { padding: .9rem 1rem; border-bottom: 1px solid #edf2f4; color: var(--service-ink); }
.service-queue-card .border-bottom:last-child { border-bottom: 0 !important; }
.dashboard-list-card { border-radius: 18px; box-shadow: 0 12px 28px rgba(16,42,67,.075) !important; }
.dashboard-list-card thead { background: #f2f7f8; }

@media (max-width: 991px) {
    .service-command-center { align-items: flex-start; flex-direction: column; }
    .service-command-metrics { width: 100%; min-width: 0; }
}

@media (max-width: 576px) {
    .service-command-center { min-height: 0; padding: 1.35rem; border-radius: 20px; }
    .service-command-center h1 { font-size: 1.55rem; }
    .service-command-metrics { grid-template-columns: repeat(3, 1fr); gap: .45rem; }
    .service-command-metric { padding: .7rem .55rem; }
    .service-command-metric strong { font-size: 1.3rem; }
    .service-command-metric span { font-size: .62rem; }
    .service-kpi-grid { gap: .55rem !important; }
}

/* Mobil Uyumluluk */
@media (max-width: 768px) {
    .scheduler-table th { min-width: 120px !important; font-size: 10px; }
    .appointment-card { padding: 3px; font-size: 10px; }
    .name-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .service-extra-accordion .accordion-button {
        font-size: 13px !important;
    }
}
