/* Add Listing page-only styles */
.add-listing-page{background:#f5f8fc;min-height:80vh;padding:36px 18px 90px}
.add-listing-shell{max-width:1050px;margin:0 auto}
.add-listing-breadcrumb{display:flex;align-items:center;gap:10px;font-size:13px;color:#64748b;margin-bottom:25px}
.add-listing-breadcrumb a{color:#2563eb;text-decoration:none;font-weight:700}
.add-listing-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:23px}
.add-listing-eyebrow{display:block;color:#2563eb;font-size:11px;font-weight:800;letter-spacing:2px;margin-bottom:10px}
.add-listing-heading h1{font-size:clamp(29px,4vw,42px);line-height:1.2;color:#0f172a;margin:0 0 10px}
.add-listing-heading p{font-size:15px;color:#64748b;margin:0}
.add-listing-badge{background:#dbeafe;color:#1d4ed8;padding:10px 15px;border-radius:25px;font-size:12px;font-weight:800;white-space:nowrap}
.add-listing-notice{padding:18px 21px;background:#fffbeb;border:1px solid #fcd34d;color:#92400e;border-radius:12px;font-size:14px;line-height:1.7;margin-bottom:27px}
#add-listing-form{display:grid;gap:25px}
.add-listing-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:30px;box-shadow:0 7px 25px rgba(15,23,42,.025)}
.add-listing-card-heading{display:flex;align-items:center;gap:17px;border-bottom:1px solid #e2e8f0;padding-bottom:22px;margin-bottom:25px}
.add-listing-step{display:grid;place-items:center;width:45px;height:45px;flex-shrink:0;border-radius:12px;background:#eff6ff;color:#2563eb;font-weight:800;font-size:15px}
.add-listing-card-heading h2{font-size:21px;color:#0f172a;margin:0 0 7px}
.add-listing-card-heading p{font-size:13px;color:#64748b;margin:0}
.add-listing-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}
.add-listing-field{min-width:0}
.add-listing-full{grid-column:1/-1}
.add-listing-field label{display:block;font-size:14px;font-weight:700;color:#334155;margin-bottom:10px}
.add-listing-field label span{color:#dc2626}
.add-listing-field input:not([type=file]),.add-listing-field textarea{box-sizing:border-box;width:100%;border:1px solid #cbd5e1;border-radius:10px;background:#fff;padding:13px 15px;color:#0f172a;font:inherit;font-size:14px;transition:border-color .2s,box-shadow .2s}
.add-listing-field input:not([type=file]){height:49px}
.add-listing-field textarea{resize:vertical;min-height:92px;line-height:1.7}
.add-listing-field input:focus,.add-listing-field textarea:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #dbeafe}
.add-listing-field input[type=file]{box-sizing:border-box;width:100%;border:1px dashed #94a3b8;border-radius:10px;padding:15px;background:#f8fafc;font-size:13px;color:#475569}
.add-listing-field small{display:block;font-size:12px;color:#64748b;line-height:1.6;margin-top:8px}
.add-listing-actions{background:#fff;border:1px solid #e2e8f0;border-radius:15px;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.add-listing-actions p{font-size:13px;color:#64748b;line-height:1.6;margin:0}
.add-listing-actions>div{display:flex;gap:11px;flex-shrink:0}
.add-listing-actions button{border:0;border-radius:10px;padding:13px 16px;background:#94a3b8;color:#fff;font-size:13px;font-weight:800;cursor:not-allowed}
@media(max-width:750px){.add-listing-heading{align-items:flex-start;flex-direction:column}.add-listing-fields{grid-template-columns:1fr}.add-listing-full{grid-column:auto}.add-listing-actions{flex-direction:column;align-items:stretch}.add-listing-actions>div{flex-direction:column}.add-listing-card{padding:23px 18px}}
@media(max-width:480px){.add-listing-page{padding:25px 13px 60px}.add-listing-card-heading h2{font-size:18px}.add-listing-card-heading{align-items:flex-start}}


/* STEP 20N-F: Advanced multi-step listing form */
.al-form{display:grid;gap:20px}
.al-navigation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.al-step-tab{border:1px solid #dbe3ee;border-radius:10px;background:#fff;
padding:12px 8px;color:#475569;font-weight:700;font-size:12px;cursor:pointer}
.al-step-tab.is-current{background:#2563eb;color:#fff;border-color:#2563eb}
.al-progress{height:7px;background:#dbeafe;border-radius:20px;overflow:hidden}
#al-progress-bar{height:100%;width:10%;background:#2563eb;transition:width .2s}
.al-step{background:#fff;border:1px solid #e2e8f0;border-radius:18px;
padding:30px;box-shadow:0 7px 25px rgba(15,23,42,.025)}
.al-step[hidden],.al-final-actions[hidden],#al-prev[hidden]{display:none!important}
.al-step-heading{display:flex;align-items:center;gap:16px;
border-bottom:1px solid #e2e8f0;padding-bottom:22px;margin-bottom:25px}
.al-step-heading>span{display:grid;place-items:center;width:44px;height:44px;
flex-shrink:0;background:#eff6ff;color:#2563eb;border-radius:12px;font-weight:800}
.al-step-heading h2{font-size:22px;margin:0 0 7px;color:#0f172a}
.al-step-heading p{margin:0;color:#64748b;font-size:13px}
.al-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.al-field{min-width:0}
.al-full{grid-column:1/-1}
.al-field label{display:block;font-weight:700;font-size:13px;
margin-bottom:9px;color:#334155}
.al-field input:not([type=file]),.al-field textarea,.al-field select{
box-sizing:border-box;width:100%;border:1px solid #cbd5e1;border-radius:10px;
padding:12px 14px;background:#fff;color:#0f172a;font:inherit;font-size:14px}
.al-field input:not([type=file]),.al-field select{min-height:47px}
.al-field textarea{resize:vertical;line-height:1.6}
.al-field input[type=file]{max-width:100%;font-size:13px;padding:12px;
border:1px dashed #94a3b8;border-radius:10px;background:#f8fafc}
.al-field input:focus,.al-field textarea:focus,.al-field select:focus{
outline:2px solid #bfdbfe;border-color:#2563eb}
.al-field small{display:block;margin-top:8px;color:#64748b;font-size:12px}
.al-inline{display:flex;gap:8px}
.al-inline input{flex:1;min-width:0}
.al-inline button,.al-actions button,.al-secondary{
border:0;border-radius:10px;background:#2563eb;color:#fff;
padding:12px 18px;font-size:13px;font-weight:800;cursor:pointer}
.al-secondary,.al-actions .al-secondary{background:#e2e8f0;color:#334155}
.al-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.al-chip{display:inline-flex;align-items:center;gap:8px;
border-radius:30px;background:#dbeafe;color:#1d4ed8;padding:7px 10px;font-size:12px}
.al-chip button{border:0;background:transparent;color:inherit;cursor:pointer}
.al-hours{display:flex;align-items:center;flex-wrap:wrap;gap:16px;
border:1px solid #e2e8f0;border-radius:10px;padding:13px}
.al-hours strong{min-width:95px}
.al-hours label,.al-check{display:flex;align-items:center;gap:8px;font-size:13px}
.al-hours input[type=time]{padding:7px;border:1px solid #cbd5e1;border-radius:7px}
.al-image-preview{display:flex;gap:12px;flex-wrap:wrap}
.al-image-preview img{width:100px;height:80px;object-fit:cover;
border-radius:9px;border:1px solid #e2e8f0}
.al-info{background:#eff6ff;color:#1e40af;padding:14px;border-radius:10px;
font-size:13px;line-height:1.6}
.al-faq-item{border:1px solid #e2e8f0;border-radius:10px;padding:16px;
margin-bottom:12px;display:grid;gap:10px}
.al-faq-item label{display:grid;gap:7px;font-size:13px;font-weight:700}
.al-faq-item input,.al-faq-item textarea{width:100%;box-sizing:border-box;
padding:11px;border:1px solid #cbd5e1;border-radius:8px;font:inherit}
.al-review{padding:18px;background:#f8fafc;border-radius:12px;
color:#334155;line-height:1.8;overflow-wrap:anywhere}
.al-actions{display:flex;justify-content:space-between;align-items:center;
gap:14px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:18px}
.al-actions span{font-size:13px;color:#64748b;font-weight:700}
.al-final-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end}
.al-final-actions button{padding:13px 16px;background:#94a3b8;color:#fff;
border:0;border-radius:9px;font-weight:700;cursor:not-allowed}
@media(max-width:750px){
.al-navigation{grid-template-columns:repeat(2,minmax(0,1fr))}
.al-fields{grid-template-columns:1fr}
.al-full{grid-column:auto}
.al-step{padding:22px 17px}
.al-actions{flex-wrap:wrap}
.al-hours{align-items:flex-start;flex-direction:column}
}


/* STEP 20N-I: reliable conditional visibility */
.al-location-fields[hidden] {
    display: none !important;
}

.al-step[hidden],
.al-final-actions[hidden],
#al-prev[hidden] {
    display: none !important;
}


/* STEP 20N-L: Interactive business location map */
.al-map-panel {
    min-width: 0;
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    padding: 18px;
    background: #f8fafc;
}
.al-map-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.al-map-heading strong {
    display: block;
    font-size: 16px;
    color: #0f172a;
}
.al-map-heading p {
    margin: 6px 0 0;
    font-size: 13px;
    color: #64748b;
}
#al-business-map {
    height: 360px;
    width: 100%;
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    background: #e2e8f0;
    z-index: 0;
}
.al-map-status {
    font-size: 13px;
    color: #334155;
    margin: 12px 0 0;
}
.al-map-note {
    font-size: 12px;
    line-height: 1.6;
    color: #64748b;
    margin: 8px 0 0;
}
.al-location-fields[hidden] {
    display: none !important;
}
@media (max-width: 750px) {
    #al-business-map {
        height: 290px;
    }
    .al-map-panel {
        padding: 12px;
    }
}


/* STEP 49J: Searchable category dropdown styling */
.al-category-search {
    position: relative;
    width: 100%;
    min-width: 0;
}

.al-category-search-input {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.al-category-search-results {
    position: absolute;
    z-index: 50;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 260px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    color: #172033;
    border: 1px solid #d5dce5;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
}

.al-category-search-results[hidden] {
    display: none !important;
}

.al-category-search-option {
    display: block;
    width: 100%;
    padding: 11px 13px;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    border-radius: 0;
    background: #fff;
    color: #172033;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.al-category-search-option:hover,
.al-category-search-option:focus-visible {
    background: #eef5ff;
    color: #123b75;
    outline: 2px solid transparent;
}

.al-category-search-empty {
    padding: 12px 13px;
    color: #64748b;
    font-size: 14px;
}

.al-category-search-input:disabled {
    cursor: not-allowed;
    opacity: .65;
}

select.al-category-native-select[hidden] {
    display: none !important;
}

@media (max-width: 640px) {
    .al-category-search-results {
        max-height: 220px;
    }

    .al-category-search-option {
        min-height: 44px;
    }
}


/* STEP 53K: Required listing plan selection */
#al-plan-choice {
    border: 2px solid #d97706;
    border-radius: 12px;
    padding: 16px;
    background: rgba(245, 158, 11, 0.07);
}
#al-plan-choice > label {
    font-weight: 700;
}
#al-listing-package {
    border: 2px solid #d97706;
    background-color: #fff;
}
#al-listing-package:focus {
    outline: 3px solid rgba(217, 119, 6, 0.2);
    outline-offset: 2px;
}
#al-plan-choice:has(#al-listing-package:valid) {
    border-color: #16a34a;
    background: transparent;
}
#al-listing-package:valid {
    border-color: #16a34a;
}
