/* Realitní administrace — vzhled dle webu pesavapartners.cz (bílá · námořnická modř #003153 · písková #ba906b) */
@import url('fonts.css');
:root {
  --green: #003153; --green-dark: #00243d; --green-soft: #e9eff4;
  --slate-900: #26313c; --slate-700: #46525e; --slate-500: #8e8e93;
  --slate-300: #d3d7db; --slate-200: #e3e6e9; --slate-100: #eef0f2; --slate-50: #f7f8f9;
  --rose: #a03030; --rose-soft: #f5ecea; --amber-soft: #f5ead9; --amber-text: #7a5f42;
  --sky-soft: #e9eef0; --sky-text: #004d6c; --violet-soft: #ece4d8; --violet-text: #7d6248;
  --card: #ffffff; --ink-side: #102343;
  --radius: 12px;
  --serif: 'Inter', 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; }
:focus, :focus-visible { outline: none !important; box-shadow: none; }
body { margin: 0; font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; background: #f0f1f3; color: var(--slate-900); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
h1 { font-family: var(--serif); font-size: 1.85rem; font-weight: 600; letter-spacing: .2px; margin: 0 0 4px; }
h2 { font-family: var(--serif); font-size: 1.22rem; font-weight: 600; letter-spacing: .2px; margin: 0 0 4px; }
h3 { margin: 0; font-size: 1.02rem; }
p { margin: 6px 0; }
.container { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.muted { color: var(--slate-500); font-size: .92rem; }
.muted-light { color: #a9b6c8; font-size: .92rem; }
.small { font-size: .85rem; }

/* Topbar */
.topbar { background: var(--card); border-bottom: 1px solid var(--slate-200); position: sticky; top: 0; z-index: 20; }
.topbar-dark { background: var(--ink-side); color: #fff; border-bottom: none; }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; }
.brand { display: flex; align-items: center; gap: 9px; font-weight: 700; font-family: var(--serif); letter-spacing: .4px; }
.brand-badge { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: var(--green); color: #fff; font-size: .85rem; font-weight: 700; }
.brand-badge-admin { background: #ba906b; color: #102343; }
.brand-logo { height: 40px; width: auto; display: block; }
.brand-sub { font-size: .92rem; font-weight: 600; letter-spacing: .3px; }
.brand-logo-side { height: 52px; margin: 0 auto; }
.sidebar-who { display: flex; align-items: center; gap: 9px; padding: 0 18px 12px; font-size: .85rem; font-weight: 600; color: #dde5f0; }
.topnav { display: flex; gap: 18px; font-size: .93rem; font-weight: 500; flex-wrap: wrap; }
.topbar:not(.topbar-dark) .topnav a { color: var(--slate-700); } .topbar:not(.topbar-dark) .topnav a:hover { color: var(--slate-900); }
.topbar-dark .topnav a { color: #b9c4d4; } .topbar-dark .topnav a:hover { color: #fff; }
.topbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Buttons & forms */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9px; padding: 9px 16px; font-size: .9rem; font-weight: 600; border: none; cursor: pointer; font-family: inherit; letter-spacing: .2px; }
.btn-primary { background: var(--green); color: #fff; box-shadow: 0 1px 2px rgba(16, 35, 67, .18); } .btn-primary:hover { background: var(--green-dark); }
.btn-secondary { background: var(--card); color: var(--slate-700); border: 1px solid var(--slate-300); } .btn-secondary:hover { background: var(--slate-100); }
.btn-danger { background: var(--rose); color: #fff; }
.btn-outline-light { background: transparent; color: #dde5f0; border: 1px solid #33486b; } .btn-outline-light:hover { background: #1a3053; }
.btn-block { width: 100%; }
.btn-lg { padding: 12px 24px; font-size: 1rem; }
.input, select.input, textarea.input { width: 100%; border: 1px solid var(--slate-300); border-radius: 9px; padding: 9px 12px; font-size: .9rem; font-family: inherit; background: #ffffff; color: var(--slate-900); }
.input::placeholder { color: #9aa5b1; opacity: 1; }
.input:focus { outline: none; border-color: var(--green); }
.label { display: block; font-size: .875rem; font-weight: 500; color: var(--slate-700); margin-bottom: 5px; }
.check { display: flex; align-items: flex-start; gap: 8px; font-size: .9rem; }
.check input { accent-color: var(--green); width: 16px; height: 16px; margin-top: 2px; }
.radio-tile { display: flex; gap: 10px; border: 1px solid var(--slate-200); border-radius: 10px; padding: 12px; font-size: .9rem; cursor: pointer; background: var(--card); }
.radio-tile:has(input:checked) { border-color: var(--green); background: var(--green-soft); }
.radio-tile input { accent-color: var(--green); margin-top: 3px; }

/* Grids & cards */
.grid { display: grid; gap: 16px; } .grid-2 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(4, 1fr); } .grid-5 { grid-template-columns: repeat(5, 1fr); }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.form-grid-3 { grid-template-columns: repeat(3, 1fr); } .form-grid-4 { grid-template-columns: repeat(4, 1fr); }
.span-2 { grid-column: span 2; } .span-3 { grid-column: span 3; }
@media (max-width: 760px) { .grid-2, .grid-3, .grid-4, .grid-5, .form-grid, .form-grid-3, .form-grid-4 { grid-template-columns: 1fr; } .span-2, .span-3 { grid-column: span 1; } .detail-layout { grid-template-columns: 1fr !important; } }
.card { background: var(--card); border: 1px solid var(--slate-200); border-radius: var(--radius); box-shadow: 0 1px 3px rgba(16, 35, 67, .05); }
.card-pad { padding: 22px; }
.section { margin-top: 30px; }

/* Badges */
.badges { display: flex; gap: 6px; flex-wrap: wrap; }
.badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 10px; font-size: .75rem; font-weight: 600; white-space: nowrap; }
.badge-dark { background: var(--slate-900); color: #e9eff4; }
.badge-green { background: #e5ecdb; color: #43602c; }
.badge-green-soft { background: var(--green-soft); color: var(--green-dark); }
.badge-amber { background: var(--amber-soft); color: var(--amber-text); }
.badge-sky { background: var(--sky-soft); color: var(--sky-text); }
.badge-violet { background: var(--violet-soft); color: var(--violet-text); }
.badge-rose { background: var(--rose-soft); color: var(--rose); }
.badge-gray { background: var(--slate-100); color: var(--slate-500); }
.badge-red { background: #f8e6e2; color: #9c3a2b; }
.badge-count { background: var(--green); color: #fff; }
.badge-filter { background: var(--card); color: var(--slate-500); border: 1px solid var(--slate-200); padding: 6px 12px; }
.badge-filter:hover { border-color: var(--slate-300); color: var(--slate-700); }
.badge-filter.active { background: var(--slate-900); color: #e9eff4; border-color: var(--slate-900); }
.chip { display: inline-flex; border-radius: 999px; padding: 6px 12px; font-size: .8rem; font-weight: 600; background: var(--card); color: var(--slate-500); border: 1px solid var(--slate-200); }
.chip-active { background: var(--slate-900); color: #e9eff4; border-color: var(--slate-900); }
.filters { display: flex; gap: 6px; flex-wrap: wrap; }

/* Alerts */
.alert { border-radius: 10px; padding: 12px 16px; font-size: .9rem; margin: 16px 0; border: 1px solid transparent; }
.alert-ok { background: #eef2e6; color: #3f5a2a; border-color: #d9e2c8; }
.alert-err { background: var(--rose-soft); color: var(--rose); border-color: #e6d2cd; }
.alert-warn { background: var(--amber-soft); color: var(--amber-text); border-color: #e5d5bd; }

/* Hero */
.hero { background: var(--card); border-bottom: 1px solid var(--slate-200); padding: 56px 0; }
.hero h1 { font-size: 2.6rem; line-height: 1.15; max-width: 720px; }
.hero p { font-size: 1.1rem; color: var(--slate-500); max-width: 700px; }
.hero-actions { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.hero-tiles { margin-top: 40px; }
.hero-tile { background: var(--slate-50); border: 1px solid var(--slate-200); border-radius: var(--radius); padding: 16px; }
.hero-tile p { margin: 4px 0 0; font-size: .88rem; color: var(--slate-500); }

/* Property cards */
.prop-card { display: flex; flex-direction: column; overflow: hidden; transition: box-shadow .15s, transform .15s; }
.prop-card:hover { box-shadow: 0 8px 22px rgba(16, 35, 67, .13); transform: translateY(-1px); }
.prop-thumb { width: 100%; height: 176px; object-fit: cover; display: block; }
.thumb-placeholder { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #e3e8ee, #cfd6df); color: #93a1b3; }
.prop-card { position: relative; }
.prop-ribbon { position: absolute; top: 14px; left: -34px; transform: rotate(-35deg); background: #a3784f; color: #fff; font-weight: 700; font-size: .72rem; letter-spacing: .08em; padding: 5px 44px; box-shadow: 0 2px 6px rgba(16,35,67,.25); z-index: 2; pointer-events: none; }
.prop-ribbon.ribbon-sold { background: #102343; }
.stav-pruh { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; padding: 12px 16px; border-radius: 12px; color: #fff; }
.stav-pruh strong { font-size: 1.05rem; letter-spacing: .04em; }
.stav-pruh.stav-reserved { background: linear-gradient(90deg, #8a5f36, #ba906b); }
.stav-pruh.stav-sold { background: linear-gradient(90deg, #102343, #003153); }
.stav-pruh.stav-archived { background: #9aa2ab; }
.stav-pruh .btn { padding: 6px 10px; font-size: .8rem; }
.stav-rychle { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.stav-rychle .btn.aktivni { outline: 2px solid var(--green); outline-offset: 1px; pointer-events: none; }
.prop-card-body { display: flex; flex-direction: column; gap: 7px; padding: 15px; flex: 1; }
.prop-card-body h3 { font-family: var(--serif); }
.prop-card-foot { display: flex; justify-content: space-between; align-items: flex-end; margin-top: auto; padding-top: 8px; font-size: 1.05rem; }

/* Detail */
.detail-layout { display: grid; grid-template-columns: 1fr 390px; gap: 28px; margin-top: 22px; align-items: start; }
.gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.gallery-main { grid-column: span 2; width: 100%; height: 300px; object-fit: cover; border-radius: var(--radius); }
.gallery-item { width: 100%; height: 160px; object-fit: cover; border-radius: var(--radius); }
.price-big { font-family: var(--serif); font-size: 1.9rem; font-weight: 700; margin: 4px 0 0; }
.commission-box { background: var(--green-soft); border: 1px solid #cfdce6; border-radius: 10px; padding: 12px 14px; margin-top: 12px; font-size: .9rem; }
.commission-box .row { display: flex; justify-content: space-between; }
.params { margin: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
@media (max-width: 640px) { .params { grid-template-columns: 1fr; } }
.param-row { display: flex; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--slate-100); padding: 7px 0; font-size: .9rem; }
.param-row dt { color: var(--slate-500); } .param-row dd { margin: 0; font-weight: 500; text-align: right; }
details.action-box { padding: 18px 22px; }
details.action-box summary { cursor: pointer; font-weight: 600; list-style: none; }
details.action-box summary::-webkit-details-marker { display: none; }
details.action-box summary::after { content: "▾"; float: right; color: var(--slate-300); }
details.action-box[open] summary::after { content: "▴"; }
details.action-box form { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; }
.desc { white-space: pre-line; font-size: .92rem; color: var(--slate-700); }

/* Tables */
.table-wrap { overflow-x: auto; }
table.tbl, table.table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.tbl th, .table th { text-align: left; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--slate-500); padding: 11px 14px; border-bottom: 1px solid var(--slate-300); background: var(--slate-50); }
.tbl td, .table td { padding: 11px 14px; border-bottom: 1px solid var(--slate-100); vertical-align: top; }
.tbl tbody tr:nth-child(even) td { background: #f7f8fa; }
.tbl tr:hover td, .table tr:hover td { background: var(--slate-100); }
.tbl .num { text-align: right; }
.code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .78rem; color: var(--slate-500); }

/* Stat tiles */
.stat { padding: 16px 18px; }
.stat b { font-family: var(--serif); font-size: 1.9rem; display: block; }
.stat span { color: var(--slate-500); font-size: .88rem; }

/* Misc */
.footer { background: var(--card); border-top: 1px solid var(--slate-200); margin-top: 48px; }
.footer-inner { display: flex; justify-content: space-between; gap: 8px; padding: 22px 16px; color: var(--slate-500); font-size: .88rem; flex-wrap: wrap; }
.page { padding: 34px 0; }
.page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.center-page { max-width: 460px; margin: 0 auto; padding: 60px 16px; text-align: center; }
.icon-circle { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; margin: 0 auto 14px; }
.icon-green { background: var(--green-soft); } .icon-amber { background: var(--amber-soft); }
.cta-dark { background: var(--ink-side); color: #fff; display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; }
.cta-dark p { color: #a9b6c8; margin: 4px 0 0; font-size: .9rem; }
.mini-thumbs { display: flex; gap: 8px; flex-wrap: wrap; }
.mini-thumbs img { width: 110px; height: 78px; object-fit: cover; border-radius: 8px; }
.inline-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.inline-form .input { flex: 1; min-width: 180px; width: auto; }
.request-card { padding: 16px 18px; margin-bottom: 12px; }
.request-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.request-quote { background: var(--slate-50); border-radius: 8px; padding: 8px 12px; margin-top: 8px; font-size: .88rem; color: var(--slate-700); }
.hr { border: none; border-top: 1px solid var(--slate-100); margin: 14px 0; }
.action-box { background: var(--card); }

/* Kompaktní tabulky se seznamy */
.btn-sm { padding: 5px 11px; font-size: .8rem; border-radius: 8px; }
.tbl .badges { gap: 4px; }
.tbl .badge { font-size: .68rem; padding: 2px 8px; }
.row-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
tr.detail-row > td { background: var(--slate-50) !important; padding: 16px 18px; border-bottom: 2px solid var(--slate-300); }
.tbl th a { color: inherit; text-decoration: none; }
.tbl th a:hover { color: var(--slate-900); }
.list-toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 14px; }
.list-toolbar .input { width: 280px; }
.nowrap { white-space: nowrap; }

/* Levý vyjížděcí panel (admin) */
.admin-shell { min-height: 100vh; }
.sidebar { position: fixed; top: 0; left: 0; bottom: 0; width: 248px; background: var(--ink-side); color: #dde5f0; display: flex; flex-direction: column; z-index: 40; transition: transform .18s ease; overflow-y: auto; }
.nav-closed .sidebar { transform: translateX(-100%); }
.sidebar-brand { display: flex; align-items: center; gap: 10px; color: #fff; padding: 18px 18px 14px; font-size: 1rem; font-family: var(--serif); letter-spacing: .5px; }
.snav { display: flex; flex-direction: column; gap: 5px; padding: 8px 10px 16px; }
.snav-item { display: flex; align-items: center; gap: 11px; padding: 9px 12px; border-radius: 9px; color: #b9c4d4; font-size: .92rem; font-weight: 500; }
.snav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.snav-item.active { background: #1d3d68; color: #fff; box-shadow: inset 3px 0 0 var(--tan, #ba906b); }
.snav-item .badge-count { margin-left: auto; background: #d8c3a5; color: #102343; }
.snav-item.active .badge-count { background: #fff; color: var(--green-dark); }
/* skupiny menu mají jemný podkres — otevřená skupina „panel", zavřená jen titulek */
.snav-group { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.06); border-radius: 11px; padding: 2px 5px 6px; }
.snav-group.closed { background: transparent; border-color: transparent; padding-bottom: 2px; }
.snav-group:not(.closed) > .snav-caption, button.snav-caption:hover { color: #cfd9e6; }
.snav-group .snav-item { padding-left: 10px; }
.snav > .snav-item { background: rgba(255,255,255,.02); border: 1px solid transparent; }
.snav > .snav-item:hover { background: rgba(255,255,255,.09); }
.snav > .snav-item.active { background: #1d3d68; }
.snav-item span:first-of-type { flex: 0 1 auto; }
.sidebar-foot { margin-top: auto; border-top: 1px solid #1a3053; padding: 10px; }
.admin-main { margin-left: 248px; transition: margin .18s ease; min-height: 100vh; display: flex; flex-direction: column; }
.nav-closed .admin-main { margin-left: 0; }
.admin-topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 14px; background: var(--card); border-bottom: 1px solid var(--slate-200); padding: 10px 18px; }
.admin-topbar-title { font-weight: 700; font-family: var(--serif); letter-spacing: .3px; }
.nav-toggle { background: none; border: 1px solid var(--slate-200); border-radius: 9px; padding: 7px 9px; cursor: pointer; color: var(--slate-700); display: inline-flex; }
.nav-toggle:hover { background: var(--slate-100); }
.admin-main .container { width: 100%; }
@media (max-width: 960px) { .admin-main { margin-left: 0; } .sidebar { box-shadow: 0 0 40px rgba(0,0,0,.35); } }
.ico { vertical-align: -2px; flex-shrink: 0; }
.snav-caption { display: block; padding: 12px 12px 4px; font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #7d8ba1; }
.snav-sub { padding: 7px 12px 7px 26px; font-size: .87rem; }

/* Stavový ukazatel (majitel) */
.steps { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.step { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; background: var(--slate-50); border: 1px solid var(--slate-200); font-size: .82rem; color: var(--slate-500); }
.step-done { background: var(--green-soft); border-color: #c7d6e2; color: var(--green-dark); font-weight: 600; }
.step-dot { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--slate-200); color: var(--slate-500); font-size: .7rem; font-weight: 700; }
.step-done .step-dot { background: var(--green); color: #fff; }

/* Kanban nástěnka */
.kanban { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; align-items: start; margin-top: 18px; }
@media (max-width: 960px) { .kanban { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .kanban { grid-template-columns: 1fr; } }
.kanban-col { background: var(--slate-100); border: 1px solid var(--slate-200); border-radius: var(--radius); padding: 10px; min-height: 120px; }
.kanban-col h3 { font-family: var(--serif); font-size: .95rem; padding: 4px 6px 10px; display: flex; justify-content: space-between; }
.kanban-col.dragover { background: var(--green-soft); }
.kanban-card { background: var(--card); border: 1px solid var(--slate-200); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; display: block; box-shadow: 0 1px 2px rgba(16,35,67,.06); }
.kanban-card[draggable="true"] { cursor: grab; }
.kanban-card .muted { font-size: .78rem; }

/* Globální vyhledávání v horní liště */
.gsearch { flex: 1; max-width: 420px; margin-left: auto; }
.gsearch input { width: 100%; border: 1px solid var(--slate-200); border-radius: 999px; padding: 7px 14px; font-size: .85rem; background: var(--slate-50); font-family: inherit; }
.gsearch input:focus { outline: none; border-color: var(--green); background: #ffffff; }

/* Mini sloupcový graf (přehled) */
.bars { display: flex; align-items: flex-end; gap: 8px; height: 110px; margin-top: 14px; }
.bars .bar { flex: 1; background: var(--green); border-radius: 6px 6px 0 0; min-height: 3px; position: relative; opacity: .85; }
.bars .bar:hover { opacity: 1; }
.bars .bar b { position: absolute; top: -20px; left: 0; right: 0; text-align: center; font-size: .72rem; color: var(--slate-700); }
.bars .bar span { position: absolute; bottom: -20px; left: 0; right: 0; text-align: center; font-size: .68rem; color: var(--slate-500); white-space: nowrap; }
.bars-wrap { padding-bottom: 26px; }

/* Mobilní doladění */
@media (max-width: 640px) {
  .card-pad { padding: 16px; }
  h1 { font-size: 1.45rem; }
  .page { padding: 22px 0; }
  .btn { padding: 10px 14px; }
  .tbl th, .tbl td, .table th, .table td { padding: 9px 10px; font-size: .82rem; }
  .list-toolbar .input { width: 100%; max-width: none !important; }
  .admin-topbar { flex-wrap: wrap; }
  .gsearch { order: 3; max-width: none; flex-basis: 100%; margin: 4px 0 2px; }
  .detail-layout { gap: 18px; }
  .request-head { align-items: flex-start; }
}

/* Sbalitelné skupiny v menu */
.snav-group { display: flex; flex-direction: column; }
button.snav-caption { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: none; cursor: pointer; font-family: inherit; padding: 10px 12px 6px; font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #8b99b0; border-radius: 8px; }
button.snav-caption:hover { color: #b9c4d4; }
.snav-chev { transition: transform .15s; }
.snav-group.closed .snav-chev { transform: rotate(-90deg); }
.snav-group.closed .snav-items { display: none; }
.snav-items { display: flex; flex-direction: column; gap: 2px; }
