:root { --brand: #4f46e5; --brand-dark: #3730a3; --ink: #172033; --muted: #667085; --surface: #fff; --canvas: #f6f7fb; --line: #e6e8f0; --success: #047857; }
html { min-height: 100%; }
body { min-height: 100vh; margin: 0; color: var(--ink); background: var(--canvas); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.site-nav { min-height: 76px; background: rgba(23,32,51,.96); box-shadow: 0 2px 16px rgba(15,23,42,.12); }
.navbar-brand { font-weight: 800; letter-spacing: -.04em; font-size: 1.25rem; }
.navbar-brand::before { content: "✦"; display: inline-grid; place-items: center; width: 27px; height: 27px; margin-right: .55rem; border-radius: 9px; color: #17123d; background: #fff; font-size: 14px; }
.navbar .nav-link { color: #cbd2e0 !important; font-weight: 600; padding: .55rem .8rem !important; border-radius: 8px; }
.navbar .nav-link:hover { color: #fff !important; background: rgba(255,255,255,.1); }
.app-main { min-height: calc(100vh - 150px); padding-top: 2.5rem; padding-bottom: 3rem; }
h1, h2, h3 { color: var(--ink); letter-spacing: -.035em; font-weight: 800; }
h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); margin-bottom: 1.35rem; }
h2 { font-size: 1.2rem; }
.card, details.card { border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 4px 14px rgba(15,23,42,.035); background: var(--surface); }
.card { padding: 1.25rem; }
.table { --bs-table-bg: transparent; margin-bottom: 0; }
.table > :not(caption) > * > * { padding: 1rem .85rem; border-color: var(--line); vertical-align: middle; }
.table thead th { color: var(--muted); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; border-bottom-width: 1px; }
.btn { border-radius: 10px; font-weight: 700; padding: .58rem 1rem; transition: transform .15s ease, box-shadow .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { border-color: var(--brand); background: var(--brand); box-shadow: 0 6px 14px rgba(79,70,229,.2); }
.btn-primary:hover, .btn-primary:focus { border-color: var(--brand-dark); background: var(--brand-dark); }
.btn-outline-primary { color: var(--brand); border-color: #c9c7ff; background: #fff; }
.btn-outline-primary:hover { border-color: var(--brand); background: #f0efff; color: var(--brand-dark); }
.form-control, .form-select { min-height: 44px; border-radius: 10px; border-color: #d9dce7; }
.form-control:focus, .form-select:focus { border-color: #9893fa; box-shadow: 0 0 0 .23rem rgba(79,70,229,.12); }
.alert { border: 0; border-radius: 12px; padding: 1rem 1.1rem; }
.booking { max-width: 920px; margin: 0 auto; }
.booking > header, .booking-hero { padding: 2rem 2rem 1.75rem; border-radius: 20px 20px 0 0; color: #fff; background: radial-gradient(circle at top right, color-mix(in srgb, var(--booking-primary, #4f46e5) 55%, white), transparent 40%), linear-gradient(135deg, color-mix(in srgb, var(--booking-primary, #4f46e5) 70%, #111827), var(--booking-primary, #4f46e5)); }
.booking-logo { width: 72px; height: 72px; object-fit: contain; border-radius: 16px; padding: .35rem; margin-bottom: .8rem; background: rgba(255,255,255,.95); }
.booking-category { margin: 1.25rem 0 .65rem; font-size: 1rem; color: #4338ca; }
.employee-photo { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex: 0 0 48px; }
.available-date-list { display: flex; gap: .55rem; overflow-x: auto; padding-bottom: .3rem; }
.date-choice { min-width: 98px; border: 1px solid #dbe2ea; border-radius: 12px; padding: .65rem .75rem; background: #fff; color: #334155; }
.date-choice.selected { border-color: var(--booking-primary, #4f46e5); background: color-mix(in srgb, var(--booking-primary, #4f46e5) 10%, white); color: var(--booking-primary, #4f46e5); font-weight: 700; }
.booking > header h1 { color: #fff; margin: 0 0 .35rem; }
.booking > header p { margin: 0; opacity: .82; }
.booking form { padding: 1.6rem; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 20px 20px; background: #fff; box-shadow: 0 12px 30px rgba(15,23,42,.06); }
.booking section { padding: 1.25rem; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.booking section h2 { display: flex; align-items: center; gap: .65rem; margin-bottom: 1rem; }
.booking section h2::before { content: ""; width: 26px; height: 26px; border-radius: 50%; background: #eeedff; }
.booking-progress { display:flex; justify-content:space-between; gap:.25rem; margin:0; padding:1.25rem 0; list-style:none; }.booking-progress li{display:flex;align-items:center;gap:.35rem;color:#98a2b3;font-size:.72rem;font-weight:700}.booking-progress span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #d9dce7;border-radius:50%;background:#fff}.booking-progress li.active{color:var(--brand)}.booking-progress li.active span{border-color:var(--brand);background:var(--brand);color:#fff}.booking-step{display:none}.booking-step.active{display:block}.step-description{margin:-.4rem 0 1.2rem;color:var(--muted)}.step-actions{display:flex;justify-content:space-between;gap:.75rem;margin-top:1.4rem}.step-actions.end{justify-content:flex-end}.service-choice{display:flex;align-items:center;gap:.8rem;height:100%;padding:1rem;border:1px solid var(--line);border-radius:12px;background:#fff}.service-choice input{accent-color:var(--brand)}.service-choice strong,.service-choice small{display:block}.service-choice small{margin-top:.2rem;color:var(--muted);font-size:.82rem}.service-choice b{display:grid;place-items:center;margin-left:auto;width:25px;height:25px;border-radius:50%;background:#f0efff;color:var(--brand)}.booking label:has(input:checked) .service-choice{border-color:var(--brand);background:#f5f4ff}.booking label:has(input:checked) .service-choice b{background:var(--brand);color:#fff}.employee-choice{display:flex;align-items:center;gap:.8rem;padding:1rem;margin-bottom:.6rem;border:1px solid var(--line);border-radius:12px;cursor:pointer}.employee-choice input{accent-color:var(--brand)}.employee-choice strong,.employee-choice small{display:block}.employee-choice small{margin-top:.15rem;color:var(--muted);font-size:.8rem}.employee-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#eeedff;color:var(--brand);font-size:.8rem;font-weight:800}.employee-choice:has(input:checked){border-color:var(--brand);background:#f5f4ff}.booking-date{max-width:380px;font-size:1.1rem}.privacy-choice{display:flex;align-items:flex-start;gap:.65rem;margin-top:1.2rem;color:var(--muted);font-size:.87rem}.privacy-choice input{margin-top:.2rem;accent-color:var(--brand)}.booking-summary{margin:0}.booking-summary div{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line)}.booking-summary dt{color:var(--muted);font-weight:600}.booking-summary dd{margin:0;text-align:right;font-weight:800}
.slot-table{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.65rem;padding:1rem;border:1px solid var(--line);border-radius:12px;background:#fafaff}.slot-button{min-height:46px;border:1px solid #d9dce7;border-radius:9px;background:#fff;color:var(--ink);font-weight:800;transition:.15s}.slot-button:hover{border-color:var(--brand);background:#f0efff;color:var(--brand)}.slot-button.selected{border-color:var(--brand);background:var(--brand);color:#fff;box-shadow:0 5px 12px rgba(79,70,229,.22)}.slot-empty{grid-column:1/-1;padding:.8rem;color:var(--muted);text-align:center}
.booking label.col-md-6 { cursor: pointer; }
.booking label .card { height: 100%; padding: 1rem; border-radius: 12px; transition: border-color .15s ease, background .15s ease; }
.booking label:has(input:checked) .card { border-color: var(--brand); background: #f5f4ff; box-shadow: 0 0 0 3px rgba(79,70,229,.08); }
.booking input[type="checkbox"] { accent-color: var(--brand); margin-right: .5rem; }
.booking .btn-lg { min-height: 52px; border-radius: 12px; }
.dashboard-hero { display: flex; justify-content: space-between; align-items: end; gap: 1rem; padding: 1.8rem; border-radius: 18px; color: #fff; background: linear-gradient(120deg, #1e1b4b, #4f46e5); }
.dashboard-hero h1 { color: #fff; margin: 0; }
.dashboard-hero p { margin: .35rem 0 0; color: #dcdafe; }
.metric-card { position: relative; overflow: hidden; min-height: 122px; padding: 1.25rem; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 4px 14px rgba(15,23,42,.035); }
.metric-card::after { content: ""; position: absolute; right: -17px; bottom: -25px; width: 82px; height: 82px; border-radius: 50%; background: #f0efff; }
.metric-card small { position: relative; z-index: 1; color: var(--muted); font-weight: 700; }
.metric-card strong { position: relative; z-index: 1; display: block; margin-top: .45rem; font-size: 1.75rem; letter-spacing: -.05em; }
.quick-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.5rem; }
.site-footer { background: #fff; border-top: 1px solid var(--line); }
.auth-page{background:#f6f7fb}.auth-shell{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}.auth-brand-panel{display:flex;flex-direction:column;justify-content:space-between;padding:3rem clamp(2rem,7vw,7rem);color:#fff;background:radial-gradient(circle at 80% 12%,#7873f7,transparent 30%),linear-gradient(135deg,#15143c,#413bb5)}.auth-brand{color:#fff;text-decoration:none;font-size:1.15rem;font-weight:800}.auth-brand:hover{color:#fff}.auth-brand-panel .eyebrow{color:#c9c7ff}.auth-brand-panel h1{margin:1rem 0;color:#fff;font-size:clamp(2.4rem,4.6vw,4rem);line-height:1.05}.auth-brand-panel h1 em{color:#b8b5ff;font-style:normal}.auth-brand-panel p{max-width:420px;color:#d7d6fb;font-size:1.05rem;line-height:1.7}.auth-feature{color:#e7e6ff;font-size:.9rem;font-weight:700}.auth-feature span{display:inline-grid;place-items:center;width:25px;height:25px;margin-right:.5rem;border-radius:50%;background:#625ce3}.auth-form-panel{display:grid;place-items:center;padding:2rem}.auth-card{width:min(100%,430px)}.auth-back{color:var(--muted);font-size:.87rem;font-weight:700;text-decoration:none}.auth-card h2{margin:2.5rem 0 .45rem;font-size:2rem}.auth-card>p{color:var(--muted)}.auth-card .form-label{font-size:.88rem;font-weight:700}.auth-submit{min-height:50px}.auth-submit span{padding-left:.85rem;font-size:1.15rem}@media(max-width:800px){.auth-shell{grid-template-columns:1fr}.auth-brand-panel{min-height:260px;padding:2rem}.auth-brand-panel>div:nth-child(2){margin-top:2.5rem}.auth-brand-panel h1{font-size:2rem}.auth-brand-panel p,.auth-feature{display:none}.auth-form-panel{align-items:start;padding:2rem 1.5rem}.auth-card h2{margin-top:2rem}}
.landing-hero { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(2.5rem, 6vw, 6rem); min-height: 570px; padding: 3rem 0 4rem; }
.landing-copy { max-width: 640px; }
.eyebrow { display: inline-block; color: var(--brand); font-size: .73rem; font-weight: 800; letter-spacing: .12em; }
.landing-copy h1 { margin: .85rem 0 1.2rem; font-size: clamp(3rem, 6vw, 5.2rem); line-height: .98; letter-spacing: -.07em; }
.landing-copy h1 em { color: var(--brand); font-style: normal; }
.landing-copy > p { max-width: 570px; color: var(--muted); font-size: 1.13rem; line-height: 1.75; }
.landing-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; margin-top: 2rem; }
.landing-actions .btn-primary { padding: .85rem 1.25rem; }.landing-actions .btn-primary span { padding-left: .9rem; font-size: 1.2rem; }.landing-actions .btn-link { color: var(--ink); font-weight: 700; }
.trust-row { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; margin-top: 2.2rem; color: var(--muted); font-size: .86rem; font-weight: 600; }
.trust-row span::first-letter { color: var(--success); }
.landing-preview { position: relative; border: 1px solid #e4e2ff; border-radius: 22px; overflow: hidden; background: #fff; box-shadow: 0 30px 70px rgba(49,46,129,.16); transform: rotate(2deg); }
.landing-preview::before { content: ""; position: absolute; inset: 0 auto auto 0; width: 100%; height: 108px; background: linear-gradient(110deg,#eeedff,#fff); }
.preview-top { position: relative; display: flex; align-items: center; gap: .35rem; height: 54px; padding: 0 1rem; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .75rem; }
.preview-top strong { margin-left: .55rem; color: var(--ink); font-size: .88rem; }.preview-top small { margin-left: auto; }.preview-dot { width: 8px; height: 8px; border-radius: 50%; background: #d5d9e5; }.preview-dot:first-child { background: #fb7185; }.preview-dot:nth-child(2) { background: #fbbf24; }.preview-dot:nth-child(3) { background: #34d399; }
.preview-body { position: relative; padding: 1.35rem; }.preview-stat { display: flex; align-items: center; justify-content: space-between; padding: 1.1rem; border-radius: 13px; background: #29265f; color: #fff; }.preview-stat small { display: block; color: #d2d1fb; }.preview-stat strong { display: block; margin-top: .1rem; font-size: 2rem; letter-spacing: -.06em; }.stat-badge { border-radius: 20px; padding: .3rem .5rem; background: rgba(255,255,255,.13); color: #b9f5d0; font-size: .75rem; font-weight: 800; }.schedule-label { margin: 1.4rem 0 .6rem; color: var(--muted); font-size: .65rem; font-weight: 800; letter-spacing: .09em; }.schedule-item { display: grid; grid-template-columns: 42px 34px 1fr 10px; align-items: center; gap: .7rem; padding: .8rem 0; border-top: 1px solid #eff0f5; }.schedule-time { color: var(--muted); font-size: .76rem; font-weight: 700; }.avatar { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:#fff; font-size:.72rem; font-weight:800; }.a-one{background:#ef8354}.a-two{background:#6a8fd6}.a-three{background:#9472cc}.schedule-item strong,.schedule-item small{display:block}.schedule-item strong{font-size:.82rem}.schedule-item small{margin-top:.16rem;color:var(--muted);font-size:.7rem}.schedule-state{width:8px;height:8px;border-radius:50%;background:#22c55e}.schedule-state.pending{background:#f59e0b}
.feature-section { padding: 5rem 0; border-top: 1px solid var(--line); }.feature-section h2 { max-width: 520px; margin: .7rem 0 2.2rem; font-size: clamp(2rem,4vw,3rem); }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }.feature-grid article { padding:1.5rem; border:1px solid var(--line); border-radius:16px; background:#fff; }.feature-grid h3 { margin-top:1rem; font-size:1.1rem; }.feature-grid p { margin:0; color:var(--muted); line-height:1.6; }.feature-icon { display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:var(--brand);background:#eeedff;font-size:.75rem;font-weight:800; }
@media (max-width: 767px) { .app-main { padding-top: 1.25rem; } .booking form { padding: 1rem; } .booking > header, .booking-hero { padding: 1.5rem; } .booking section { padding: 1rem; } .booking-progress{overflow-x:auto;justify-content:flex-start;padding:.9rem 0;gap:.85rem}.booking-progress li{white-space:nowrap}.booking-progress li:not(.active){font-size:0}.booking-progress li:not(.active) span{font-size:.72rem}.slot-table{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;padding:.75rem}.table { font-size: .88rem; } .dashboard-hero { align-items: start; flex-direction: column; } .landing-hero{grid-template-columns:1fr;min-height:0;padding:1.5rem 0 3rem}.landing-copy h1{font-size:clamp(2.7rem,13vw,4rem)}.landing-preview{margin:1rem .55rem 0;transform:none}.feature-section{padding:3rem 0}.feature-grid{grid-template-columns:1fr} }

/* İşletme yönetim paneli */
.panel-body{background:#f5f7fb}.panel-shell{display:flex;min-height:100vh}.panel-sidebar{position:sticky;top:0;display:flex;flex:0 0 264px;flex-direction:column;width:264px;height:100vh;padding:1.35rem .9rem;background:linear-gradient(180deg,#151d31,#1b2740);color:#e5eaf4;z-index:20}.panel-brand{display:flex;align-items:center;gap:.7rem;padding:.5rem .6rem 1.7rem;color:#fff;text-decoration:none;line-height:1.05}.panel-brand:hover{color:#fff}.panel-brand>span{display:grid;place-items:center;width:37px;height:37px;border-radius:12px;background:#fff;color:#312e81;font-size:1.05rem}.panel-brand strong{font-size:1.05rem;letter-spacing:-.04em}.panel-brand small{color:#9eabca;font-size:.69rem;font-weight:700;letter-spacing:.04em}.panel-nav{overflow-y:auto;flex:1;padding-right:.15rem}.panel-nav-link{display:flex;align-items:center;gap:.72rem;margin:.15rem 0;padding:.7rem .7rem;border-radius:10px;color:#b8c2d9;font-size:.88rem;font-weight:700;text-decoration:none}.panel-nav-link:hover{background:rgba(255,255,255,.08);color:#fff}.panel-nav-link i{display:grid;place-items:center;width:19px;color:#a9a4ff;font-size:1rem;font-style:normal}.panel-nav-cta{margin:.85rem 0 1rem;background:#514bc1;color:#fff;box-shadow:0 7px 15px rgba(0,0,0,.2)}.panel-nav-cta:hover{background:#625ce3}.panel-nav-cta i{color:#fff}.panel-nav-caption{display:block;margin:1.25rem .7rem .35rem;color:#71809f;font-size:.65rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.panel-user{display:flex;align-items:center;gap:.62rem;margin-top:1rem;padding:.75rem .65rem;border-top:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none}.panel-user>span{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:#625ce3;font-size:.76rem;font-weight:800}.panel-user strong{font-size:.74rem}.panel-user small{display:block;margin-top:.15rem;color:#9eabca;font-size:.64rem;font-weight:600}.panel-user b{margin-left:auto;color:#9eabca;font-size:1.25rem}.panel-main{min-width:0;flex:1}.panel-topbar{display:flex;align-items:center;min-height:91px;padding:1rem clamp(1.25rem,3vw,3rem);border-bottom:1px solid var(--line);background:rgba(255,255,255,.88)}.panel-topbar p,.panel-page-heading p{margin:0 0 .2rem;color:var(--muted);font-size:.76rem;font-weight:700}.panel-topbar h1{margin:0;font-size:1.45rem}.panel-topbar-actions{margin-left:auto}.panel-menu-button{display:none;margin-right:1rem;border:0;border-radius:9px;background:#eeedff;color:var(--brand);font-size:1.1rem}.panel-page{max-width:1540px;padding:clamp(1.25rem,3vw,2.5rem);margin:0 auto}.panel-page>h1{display:none}.panel-page-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.3rem}.panel-page-heading h2{margin:0;font-size:1.45rem}.panel-data-card,.panel-form-card{padding:1.25rem;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 4px 14px rgba(15,23,42,.035)}.panel-table td small{display:block;margin-top:.2rem;color:var(--muted);font-size:.75rem}.status-chip{display:inline-flex;padding:.32rem .6rem;border-radius:99px;background:#f0efff;color:#4f46e5;font-size:.72rem;font-weight:800}.status-active{background:#dcfce7;color:#167044}.status-muted{background:#eef1f6;color:#667085}.appointment-status-form{display:flex;justify-content:flex-end;gap:.45rem;align-items:center}.appointment-status-form .form-select{min-height:34px;width:110px;padding-top:.2rem;padding-bottom:.2rem}.panel-empty{padding:2rem!important;color:var(--muted);text-align:center}.panel-edit{display:inline-block;text-align:left}.panel-edit summary{cursor:pointer;color:var(--brand);font-size:.8rem;font-weight:800}.panel-edit-form{display:grid;gap:.5rem;width:240px;margin-top:.7rem;padding:.8rem;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:0 10px 22px rgba(15,23,42,.12)}.panel-edit-form .form-control{min-height:34px;font-size:.8rem}.panel-backdrop{display:none}
@media(max-width:900px){.panel-sidebar{position:fixed;left:0;transform:translateX(-105%);transition:transform .2s ease}.panel-shell.panel-menu-open .panel-sidebar{transform:translateX(0)}.panel-shell.panel-menu-open .panel-backdrop{position:fixed;inset:0;display:block;background:rgba(15,23,42,.46);z-index:10}.panel-menu-button{display:block}.panel-topbar{min-height:76px}.panel-topbar h1{font-size:1.18rem}.panel-topbar-actions{display:none}.appointment-status-form{display:grid;justify-content:stretch}.appointment-status-form .form-select{width:100%}}
@media(max-width:575px){.panel-page-heading{align-items:start;flex-direction:column}.panel-data-card,.panel-form-card{padding:.7rem}.panel-table{min-width:690px}.panel-topbar{padding:.8rem 1rem}.panel-page{padding:1rem}.panel-edit-form{width:205px}}
@media (max-width: 767.98px) {
  .calendar-heading { gap: .75rem; }
  .calendar-filter { width: 100%; }
  .calendar-filter .form-select { width: 100%; }
  .panel-page .panel-data-card:has(#calendar) { padding: .35rem; overflow: hidden; }
  #calendar .fc { font-size: .82rem; }
  #calendar .fc-toolbar { margin-bottom: .65rem; }
  #calendar .fc-toolbar-chunk { display: flex; align-items: center; gap: .2rem; }
  #calendar .fc-timegrid-axis { width: 3.2rem; }
  #calendar .fc-timegrid-slot { height: 2.7rem; }
  #calendar .fc-event { border-radius: 6px; padding: 2px 3px; }
  .fc .fc-toolbar { flex-wrap: wrap; gap: .5rem; }
  .fc .fc-toolbar-title { font-size: 1.05rem; }
  .fc .fc-button { padding: .3rem .45rem; font-size: .78rem; }
  .fc .fc-timegrid-slot-label { font-size: .7rem; }
  .fc .fc-timegrid-event { font-size: .72rem; }
  #calendar { min-width: 0; overflow-x: auto; }
}