@font-face { font-family: Inter; src: url('../assets/points/inter-400.ttf'); font-weight: 400; font-display: swap; }
@font-face { font-family: Inter; src: url('../assets/points/inter-600.ttf'); font-weight: 600; font-display: swap; }
@font-face { font-family: Inter; src: url('../assets/points/inter-700.ttf'); font-weight: 700; font-display: swap; }
:root { --ink: #203438; --muted: #667b80; --soft: #f3f6f7; --line: #dce5e7; --green: #087f80; --green-dark: #066869; --green-soft: #e4f4f1; font-family: Inter, sans-serif; }
body { font-size: 14px; line-height: 1.45; }
.sidebar { width: 248px; padding: 24px; gap: 24px; }
.brand { padding: 0; color: var(--green); font-size: 19px; font-weight: 700; letter-spacing: normal; }
.organization-nav { font-size: 13px; color: var(--muted); }
.organization-nav p { margin: 0; line-height: 1.6; white-space: pre-line; }
.nav { display: grid; gap: 24px; margin: 0; }
.nav-item { min-height: 44px; margin: 0; padding: 12px; border-radius: 8px; font-weight: 400; color: var(--ink); }
.nav-item.active { color: var(--green); font-weight: 600; }
.logout-button { align-self: flex-start; margin: 0; min-height: 44px; padding: 0 8px; border: 0; background: transparent; color: var(--green); font-weight: 600; }
.main { margin-left: 248px; padding: 32px; }
.topbar { min-height: 0; padding: 0; border: 0; background: transparent; backdrop-filter: none; }
.breadcrumbs { margin: 0 0 24px; font-size: 13px; color: var(--muted); font-weight: 400; }
.breadcrumbs span { margin: 0; color: inherit; }
.topbar h1 { font-size: 28px; line-height: 1.45; font-weight: 700; letter-spacing: normal; }
#page-subtitle { margin: 6px 0 0; color: var(--muted); }
.content { width: 100%; max-width: none; padding: 0; margin: 24px 0 0; }
#points-content, #points-list-view { display: flex; flex-direction: column; gap: 24px; }
.organization-card, .point-panel { border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 24px; }
.organization-card > div { display: flex; align-items: center; gap: 12px; justify-content: space-between; }
.organization-card strong { font-size: 18px; font-weight: 600; }
.organization-card.compact strong { font-size: 14px; }
.organization-card p { margin: 16px 0 0; color: var(--muted); }
.point-badge { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; background: var(--green-soft); color: var(--green); font-size: 12px; font-weight: 600; white-space: nowrap; }
.point-badge.muted { color: var(--muted); background: var(--soft); }
.points-heading { display: flex; align-items: center; gap: 12px; }
.points-heading h2 { flex: 1; margin: 0; font-size: 20px; font-weight: 600; }
.secondary-button, .primary-button { display: inline-flex; min-height: 44px; height: 44px; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid var(--line); border-radius: 8px; font-size: 14px; font-weight: 600; color: var(--green); box-shadow: none; white-space: nowrap; }
.primary-button { background: var(--green); border-color: transparent; color: #fff; }
.primary-button:disabled { background: #e8eeef; color: var(--muted); cursor: default; }
.secondary-button:disabled { cursor: default; opacity: .5; }
#list-state:empty, #address-search-status:empty, #address-results:empty { display: none; }
#list-state { margin: 0; color: var(--muted); }
.points-table-wrap { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: #fff; }
.points-table { table-layout: fixed; }
.points-table th { padding: 14px 16px; height: auto; background: var(--soft); color: var(--muted); font-size: 12px; font-weight: 600; text-transform: none; letter-spacing: normal; }
.points-table th:nth-child(1) { width: 34%; }
.points-table th:nth-child(2) { width: 16%; }
.points-table th:nth-child(3) { width: 34%; }
.points-table th:nth-child(4) { width: 16%; }
.points-table td { height: 68px; padding: 12px 16px; color: var(--ink); font-size: 13px; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.point-edit { height: 44px; padding: 0 8px; border: 0; border-radius: 8px; color: var(--green); background: transparent; font-size: 14px; font-weight: 600; }
.point-edit:hover { background: var(--green-soft); }
.points-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); }
.points-pagination p { margin: 0; }
.points-pagination > div { display: flex; gap: 8px; align-items: center; }
.point-notice { padding: 16px; background: var(--green-soft); border-radius: 8px; }
.point-notice strong { color: var(--green); font-weight: 600; }
.point-notice p { margin: 8px 0 0; }
.pharmacy-form { padding: 0; }
.point-editor-grid { display: grid; grid-template-columns: minmax(0, 550px) minmax(532px, 1fr); gap: 12px; align-items: start; }
.point-editor-left { display: flex; flex-direction: column; gap: 20px; }
.point-address-view h2 { margin: 0 0 16px; font-size: 18px; font-weight: 600; }
.point-address-view p { margin: 0 0 12px; }
.point-address-view .field-hint:last-child { margin-bottom: 0; }
.pharmacy-form fieldset.point-panel { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 24px; position: relative; border: 1px solid var(--line); }
.point-panel legend { float: left; padding: 0; width: 100%; margin-bottom: 16px; font-size: 18px; font-weight: 600; }
.pharmacy-form label { font-size: 14px; margin-bottom: 6px; font-weight: 600; }
.pharmacy-form input { min-height: 44px; height: 44px; padding: 10px 12px; border-radius: 8px; margin: 0 0 6px; }
.pharmacy-form input::placeholder { color: var(--muted); }
.pharmacy-form .field-hint { margin: 0 0 16px; font-size: 13px; line-height: 1.45; }
.address-search-row { align-items: flex-start; }
.address-search-row input { margin-bottom: 6px; }
.selected-address { display: flex; gap: 10px; align-items: center; padding: 12px; margin-bottom: 16px; border-radius: 8px; background: var(--green-soft); }
.selected-address p { margin: 0; }
.selected-address p + p { margin-top: 4px; color: var(--muted); }
.selected-address img { flex-shrink: 0; }
.pharmacy-form[data-mode='edit'] #manual-coordinates summary,
.pharmacy-form[data-mode='edit'] .map-search-link { display: none; }
.pharmacy-form[data-mode='edit'] .coordinate-fields { padding-top: 0; }
.pharmacy-form #edit-point-notice { margin-bottom: 0; font-size: 14px; }
.point-map { height: 180px; border: 0; border-radius: 10px; background: #eaf0ec; }
.pharmacy-form .map-hint { margin-top: 16px; }
.map-search-link { align-self: flex-start; display: flex; align-items: center; height: 44px; padding: 0 8px; color: var(--green); font-weight: 600; margin-bottom: 16px; text-decoration: underline; }
.pharmacy-form .confirmation { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font-weight: 400; }
.pharmacy-form input[type='checkbox'] { appearance: none; flex-shrink: 0; width: 20px; min-height: 20px; height: 20px; padding: 0; margin: 0; border-radius: 4px; background: white; cursor: pointer; }
.pharmacy-form input[type='checkbox']:checked { border-color: var(--green); background: var(--green) url('../assets/points/check.svg') center / 14px 14px no-repeat; }
.pharmacy-form input:disabled { background-color: var(--soft); color: var(--muted); cursor: default; }
#confirmation-status { margin-bottom: 0; }
#manual-coordinates { margin-bottom: 16px; font-size: 13px; color: var(--muted); }
#manual-coordinates summary, .supplier-details summary { cursor: pointer; }
.coordinate-fields { padding-top: 12px; }
.pharmacy-form .activity-toggle { display: flex; align-items: center; gap: 12px; min-height: 44px; margin: 0 0 12px; font-weight: 400; cursor: pointer; }
.pharmacy-form input.point-activation-switch[type='checkbox'] { width: 44px; min-height: 24px; height: 24px; border: 1px solid var(--muted); border-radius: 999px; background: var(--muted); transition: background-color .15s, border-color .15s; }
.pharmacy-form input.point-activation-switch::before { content: ''; display: block; width: 18px; height: 18px; margin: 2px; border-radius: 50%; background: white; transition: transform .15s; }
.pharmacy-form input.point-activation-switch[type='checkbox']:checked { border-color: var(--green); background: var(--green); }
.pharmacy-form input.point-activation-switch:checked::before { transform: translateX(20px); }
.pharmacy-form input.point-activation-switch:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.pharmacy-form input.point-activation-switch[type='checkbox']:disabled { opacity: .45; cursor: default; }
@media (prefers-reduced-motion: reduce) {
    .pharmacy-form input.point-activation-switch, .pharmacy-form input.point-activation-switch::before { transition: none; }
}
.weekly-table { border: 1px solid var(--line); border-radius: 10px; overflow-x: auto; width: 100%; }
.hours-header, .hours-row { display: grid; grid-template-columns: 32px minmax(80px, 1fr) minmax(80px, 1fr) 82px 118px; align-items: center; gap: 8px; padding: 12px; min-width: 480px; }
.pharmacy-form .hours-toggle { display: flex; align-items: center; justify-content: center; min-height: 44px; margin: 0; cursor: pointer; }
.hours-header { font-size: 12px; color: var(--muted); font-weight: 600; background: var(--soft); }
.hours-row { min-height: 68px; border-top: 1px solid var(--line); font-size: 13px; }
.hours-row input[type='time'] { min-width: 0; width: 100%; margin: 0; font-size: 14px; }
.hours-row input[type='time']::-webkit-calendar-picker-indicator { display: none; }
.hours-row:is(.closed, .all-day) input[type='time']::-webkit-datetime-edit { color: transparent; }
#schedule-summary { margin: 16px 0 0; }
.point-actions { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.point-actions p { color: var(--muted); margin: 0; }
.supplier-details { font-size: 13px; color: var(--muted); }
.supplier-details:not([open]) { margin-bottom: -12px; }
.supplier-details[open] .point-panel { margin-top: 12px; }
.point-map-marker { display: flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 50%; background: var(--green); }
.point-map-marker img { width: 20px; height: 20px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#commission-form { margin: 0; padding: 24px; }
@media (max-width: 1250px) {
    .point-editor-grid { grid-template-columns: 1fr; gap: 20px; align-items: start; }
    .hours-header, .hours-row { gap: 8px; padding-left: 12px; padding-right: 12px; }
}
@media (max-width: 920px) {
    .main { margin-left: 0; padding: 24px; }
    .topbar { align-items: flex-start; }
    .menu-button { margin: 0 12px 0 0; }
    .sidebar { overflow-y: auto; }
}
@media (max-width: 680px) {
    .main { padding: 20px 16px; }
    .topbar h1 { font-size: 24px; }
    .breadcrumbs { font-size: 12px; margin-bottom: 12px; }
    .organization-card, .pharmacy-form fieldset.point-panel { padding: 20px; }
    .organization-card > div { align-items: flex-start; flex-direction: column; }
    .organization-card strong { font-size: 16px; }
    .points-heading { flex-wrap: wrap; }
    .points-heading h2 { flex-basis: 100%; }
    .primary-button { width: auto; }
    .points-table, .points-table tbody { display: block; }
    .points-table tbody { padding: 0 16px; }
    .points-table tr { display: grid; grid-template-columns: 1fr 1fr; padding: 16px 0; gap: 12px; }
    .points-table td { height: auto; border: 0; }
    .points-table td:first-child, .points-table td:nth-child(3) { grid-column: 1 / -1; }
    .points-table td::before { content: attr(data-label); font-family: inherit; text-transform: none; font-size: 12px; font-weight: 400; letter-spacing: normal; color: var(--muted); }
    .point-edit { padding-left: 0; }
    .points-pagination { flex-wrap: wrap; }
    .point-editor-grid { grid-template-columns: 1fr; gap: 20px; }
    .address-search-row { flex-direction: row; }
    .hours-row input[type='time'] { padding: 10px 6px; font-size: 13px; }
    .hours-header { font-size: 10px; }
    .coordinate-fields { grid-template-columns: 1fr 1fr; }
    .point-actions { flex-wrap: wrap; }
    .point-actions p { flex-basis: 100%; }
    .pharmacy-form .confirmation { align-items: flex-start; }
}

#map-status[data-state='ready'] { display: none; }

.hours-time { position: relative; min-width: 0; }
.hours-row:is(.closed, .all-day) .hours-time::after { content: '—'; position: absolute; left: 12px; top: 12px; color: var(--muted); pointer-events: none; }

@media (max-width: 680px) {
    .weekly-table { overflow: hidden; }
    .hours-header { display: none; }
    .hours-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-width: 0; gap: 12px; padding: 16px; }
    .hours-row > span:first-child { grid-column: 1 / -1; font-weight: 600; }
    .hours-row:first-child { border-top: 0; }
    .hours-time::before, .hours-toggle::before { content: attr(data-label); display: block; margin-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 400; }
    .pharmacy-form .hours-toggle { align-items: flex-start; flex-direction: column; justify-content: flex-start; }
    .hours-row:is(.closed, .all-day) .hours-time::after { top: 35px; }
}

/* Keep point availability beside the address, with the same form ownership. */
.point-page-heading { flex: 1; min-width: 0; }
.topbar:has(#point-activity:not([hidden])) { align-items: center; gap: 24px; }
#point-activity { flex: 0 0 440px; min-width: 0; margin: 40px 0 0; padding: 16px; }
#point-activity .activity-toggle { min-height: 32px; margin-bottom: 8px; }
#point-activity .field-hint { margin-bottom: 0; }
.organization-card p { margin: 0; }
@media (max-width: 1250px) {
    .topbar:has(#point-activity:not([hidden])) { flex-wrap: wrap; }
    #point-activity { flex-basis: 100%; margin-top: 0; }
}

.organization-card .field-hint { margin-top: 8px; }
