/* CTLG Phase 79 - Match-Locations */

.page-location,
.page-location-admin {
    background:
        radial-gradient(circle at 0 0, rgba(150,22,18,.16), transparent 32%),
        radial-gradient(circle at 100% 0, rgba(234,176,50,.13), transparent 34%),
        #030303;
}

.location-shell {
    width: min(100%, 1500px);
    margin: 0 auto;
}

.location-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(30px, 5vw, 66px);
    border: 1px solid rgba(234,176,50,.28);
    border-radius: 34px;
    background:
        linear-gradient(90deg, rgba(0,0,0,.92), rgba(0,0,0,.62)),
        radial-gradient(circle at 100% 0, rgba(184,58,47,.20), transparent 36%),
        url('../img/hero3.png') center/cover no-repeat;
    box-shadow: 0 34px 110px rgba(0,0,0,.45);
}

.location-hero h1 {
    max-width: 980px;
    margin: 0;
    color: #fff;
    font-size: clamp(44px, 6vw, 96px);
    line-height: .9;
    text-transform: uppercase;
    letter-spacing: -.055em;
}

.location-hero p:not(.eyebrow) {
    max-width: 900px;
    margin: 20px 0 0;
    color: #e8e8e8;
    font-size: clamp(18px, 1.45vw, 24px);
    line-height: 1.5;
}

.location-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(340px, .55fr);
    gap: 22px;
    margin-top: 24px;
}

.location-card,
.location-form-card,
.location-panel,
.location-empty {
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 28px;
    background:
        radial-gradient(circle at 100% 0, rgba(184,58,47,.10), transparent 38%),
        linear-gradient(135deg, rgba(18,20,22,.96), rgba(5,6,8,.96));
    box-shadow: 0 26px 80px rgba(0,0,0,.28);
}

.location-card,
.location-form-card,
.location-panel,
.location-empty {
    padding: clamp(22px, 3vw, 36px);
}

.location-card h2,
.location-form-card h2,
.location-panel h2,
.location-empty h2 {
    margin: 0 0 16px;
    color: #fff;
    font-size: clamp(30px, 3vw, 50px);
    line-height: .96;
    text-transform: uppercase;
    letter-spacing: -.035em;
}

.location-form {
    display: grid;
    gap: 18px;
}

.location-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.location-form label {
    display: block;
}

.location-form label span,
.location-label {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: 12px;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.location-form input,
.location-form select,
.location-form textarea {
    width: 100%;
    min-height: 58px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 18px;
    background: rgba(0,0,0,.38);
    color: #fff;
    padding: 0 18px;
    font-size: 16px;
    outline: none;
}

.location-form select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 52px;
    background:
        linear-gradient(45deg, transparent 50%, #ffd56d 50%) calc(100% - 23px) 25px/7px 7px no-repeat,
        rgba(0,0,0,.38);
}

.location-form textarea {
    min-height: 130px;
    padding: 16px 18px;
    resize: vertical;
}

.location-form input:focus,
.location-form select:focus,
.location-form textarea:focus {
    border-color: rgba(234,176,50,.75);
    box-shadow: 0 0 0 4px rgba(234,176,50,.12);
}

.location-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.location-check {
    display: flex !important;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    background: rgba(255,255,255,.04);
    color: #fff;
    font-weight: 900;
}

.location-check input {
    width: 20px;
    height: 20px;
    min-height: auto;
    accent-color: #eab032;
}

.location-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.location-status,
.location-pill,
.location-request-status {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    padding: 0 14px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(0,0,0,.34);
    color: #eee;
    font-size: 12px;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.location-status.approved,
.location-request-status.accepted {
    border-color: rgba(80,255,130,.34);
    background: rgba(20,120,60,.18);
    color: #76ff9b;
}

.location-status.pending,
.location-request-status.requested,
.location-request-status.countered {
    border-color: rgba(234,176,50,.36);
    background: rgba(234,176,50,.10);
    color: #ffd56d;
}

.location-status.rejected,
.location-status.blocked,
.location-request-status.declined {
    border-color: rgba(255,80,80,.40);
    background: rgba(255,60,60,.10);
    color: #ff9d9d;
}

.location-list {
    display: grid;
    gap: 18px;
    margin-top: 24px;
}

.location-list-card {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 26px;
    background:
        radial-gradient(circle at 100% 0, rgba(184,58,47,.10), transparent 34%),
        linear-gradient(135deg, rgba(18,20,22,.96), rgba(5,6,8,.96));
}

.location-thumb {
    width: 112px;
    height: 88px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(184,58,47,.32);
    background: rgba(184,58,47,.10);
    color: #ff8b72;
    font-size: 34px;
}

.location-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.location-list-card h2 {
    margin: 0 0 8px;
    color: #fff;
    font-size: 30px;
}

.location-list-card p {
    margin: 5px 0;
    color: #cfcfcf;
}

.location-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.location-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 22px;
}

.location-dashboard-stats article {
    padding: 22px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 24px;
    background: rgba(255,255,255,.04);
}

.location-dashboard-stats strong {
    display: block;
    color: #ffd56d;
    font-size: 42px;
    line-height: 1;
}

.location-dashboard-stats span {
    display: block;
    margin-top: 8px;
    color: #ddd;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-size: 12px;
}

.location-request-card {
    display: grid;
    gap: 14px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 24px;
    background: rgba(255,255,255,.04);
}

.location-request-card h3 {
    margin: 0;
    color: #fff;
    font-size: 26px;
}

.location-request-card blockquote {
    margin: 0;
    padding: 16px 18px;
    border-left: 4px solid #eab032;
    border-radius: 16px;
    background: rgba(234,176,50,.08);
    color: #fff;
}

.location-admin-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 22px 0;
}

.location-admin-tabs a {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 15px;
    background: rgba(255,255,255,.045);
    color: #fff;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.location-admin-tabs a.active {
    border-color: rgba(234,176,50,.70);
    background: rgba(234,176,50,.12);
    color: #ffd56d;
}

.location-map-dot {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: radial-gradient(circle, #ff6b4a 0%, #b83a2f 44%, #3a0907 100%);
    box-shadow: 0 0 22px rgba(255,80,55,.58), 0 0 0 6px rgba(184,58,47,.18);
}

@media (max-width: 980px) {
    .location-grid,
    .location-list-card {
        grid-template-columns: 1fr;
    }

    .location-dashboard-stats,
    .location-form-grid,
    .location-checkbox-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .location-list-card .location-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .location-shell {
        width: 100%;
    }

    .location-hero {
        padding: 24px;
        border-radius: 26px;
    }

    .location-hero h1 {
        font-size: clamp(38px, 13vw, 58px);
    }

    .location-form-grid,
    .location-checkbox-grid,
    .location-dashboard-stats {
        grid-template-columns: 1fr;
    }

    .location-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .location-actions a,
    .location-actions button,
    .location-actions .btn-primary,
    .location-actions .btn-secondary {
        width: 100%;
    }
}


/* CTLG Phase 82 - Koordinaten aus Adresse */
.location-geocode-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 18px;
    border: 1px solid rgba(234,176,50,.22);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0, rgba(234,176,50,.10), transparent 36%),
        rgba(255,255,255,.035);
}

.location-geocode-box strong {
    display: block;
    color: #fff;
    font-size: 16px;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.location-geocode-box p {
    margin: 6px 0 0;
    color: #bdbdbd;
    line-height: 1.45;
}

.location-geocode-status {
    grid-column: 1 / -1;
    min-height: 20px;
    margin: 0;
    font-size: 14px;
    font-weight: 800;
}

.location-geocode-status[data-type="success"] {
    color: #76ff9b;
}

.location-geocode-status[data-type="error"] {
    color: #ff9d9d;
}

.location-geocode-status[data-type="loading"] {
    color: #ffd56d;
}

@media (max-width: 720px) {
    .location-geocode-box {
        grid-template-columns: 1fr;
    }

    .location-geocode-box .btn-secondary {
        width: 100%;
    }
}


/* CTLG Phase 87 - Betreiberdashboard, Features, Uploads */
.location-dashboard-stats.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.location-request-card.is-unread {
    border-color: rgba(234,176,50,.50);
    background:
        radial-gradient(circle at 100% 0, rgba(234,176,50,.14), transparent 38%),
        rgba(255,255,255,.045);
}

.location-actions .danger,
.btn-secondary.danger {
    border-color: rgba(255,80,80,.45) !important;
    color: #ff9d9d !important;
}

.location-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 22px 0;
}

.location-feature {
    min-height: 118px;
    padding: 18px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 22px;
    background: rgba(255,255,255,.045);
    display: grid;
    gap: 8px;
    align-content: center;
}

.location-feature i {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: rgba(255,255,255,.07);
    color: #aaa;
    font-size: 18px;
}

.location-feature span {
    color: #fff;
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 12px;
}

.location-feature strong {
    font-size: 22px;
}

.location-feature.is-yes {
    border-color: rgba(80,255,130,.30);
    background: rgba(30,150,70,.10);
}

.location-feature.is-yes i,
.location-feature.is-yes strong {
    color: #76ff9b;
}

.location-feature.is-no {
    opacity: .55;
}

.location-share-box {
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.10);
}

.location-form input[type="file"] {
    padding: 17px 18px;
    line-height: 1.2;
}

@media (max-width: 900px) {
    .location-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .location-dashboard-stats.compact,
    .location-feature-grid {
        grid-template-columns: 1fr;
    }
}


/* CTLG Phase 91 - Location UI, Bilder, Logos, Benachrichtigungen */
.location-panel {
    min-width: 0;
    overflow: hidden;
}

.location-panel h2 {
    font-size: clamp(28px, 2.3vw, 42px) !important;
    word-break: normal;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.location-dashboard .location-panel h2,
.page-location-dashboard .location-panel h2 {
    font-size: clamp(26px, 2.1vw, 38px) !important;
    letter-spacing: -.04em;
}

.location-grid {
    align-items: start;
}

.location-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Dashboard thumbnail with optional logo badge */
.location-thumb-stack {
    position: relative;
    overflow: visible;
}

.location-logo-badge {
    position: absolute;
    right: -8px;
    bottom: -8px;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    border: 1px solid rgba(234,176,50,.50);
    background: rgba(0,0,0,.82);
    box-shadow: 0 10px 30px rgba(0,0,0,.45);
    overflow: hidden;
}

.location-logo-badge img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 4px;
}

/* Detail page: Betreiber-/Location-Logo sichtbar */
.location-hero-with-logo {
    padding-right: clamp(30px, 5vw, 66px);
}

.location-detail-logo {
    width: 118px;
    height: 118px;
    display: grid;
    place-items: center;
    margin-bottom: 18px;
    border: 1px solid rgba(234,176,50,.44);
    border-radius: 28px;
    background: rgba(0,0,0,.52);
    box-shadow: 0 18px 50px rgba(0,0,0,.35);
    overflow: hidden;
}

.location-detail-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 10px;
}

.location-detail-image {
    width: 100% !important;
    height: clamp(260px, 32vw, 440px) !important;
    margin-bottom: 24px !important;
    border-radius: 24px !important;
    overflow: hidden;
}

.location-detail-image.logo-only {
    height: 260px !important;
    background:
        radial-gradient(circle at 50% 50%, rgba(234,176,50,.12), transparent 42%),
        rgba(0,0,0,.35);
}

.location-detail-image.logo-only img {
    object-fit: contain;
    padding: 32px;
}

/* Admin thumbnail fix */
.page-location-admin .location-thumb,
.admin-location-card .location-thumb {
    overflow: hidden;
    background: rgba(255,255,255,.045);
}

.page-location-admin .location-thumb img,
.admin-location-card .location-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Share block kompakter */
.location-share-box h2 {
    font-size: clamp(30px, 2.6vw, 48px) !important;
}

@media (max-width: 980px) {
    .location-grid {
        grid-template-columns: 1fr;
    }

    .location-panel h2 {
        font-size: clamp(26px, 9vw, 42px) !important;
    }
}


/* CTLG Phase 92 - Location-Anfrage aus Terminplanung */
.location-request-card blockquote {
    margin: 16px 0;
    padding: 16px 18px;
    border-left: 4px solid rgba(234,176,50,.70);
    border-radius: 16px;
    background: rgba(234,176,50,.07);
    color: #f2f2f2;
    line-height: 1.5;
}

.location-request-card p strong {
    color: #ffd56d;
}

.location-request-status.requested {
    color: #ffd56d;
    border-color: rgba(234,176,50,.45);
    background: rgba(234,176,50,.10);
}

.location-request-status.accepted {
    color: #76ff9b;
    border-color: rgba(80,255,130,.38);
    background: rgba(30,150,70,.12);
}

.location-request-status.declined,
.location-request-status.cancelled {
    color: #ff9d9d;
    border-color: rgba(255,80,80,.38);
    background: rgba(160,30,30,.12);
}

.location-request-status.countered {
    color: #9dccff;
    border-color: rgba(70,150,255,.38);
    background: rgba(30,80,160,.12);
}
