/* Axomify Location Gate — self-contained styling (site-wide, so it can't
   depend on any other plugin's CSS being loaded on this particular page).
   Same brand palette (yellow/ink/canvas, Sora/Inter) as Smart Checkout's own
   UI, kept consistent across all in-house Axomify plugins.

   v1.0.4: repositioned from a big centred card on a heavy dark backdrop to a
   small card in the top-left corner on a light backdrop -- the owner compared
   it directly to Blinkit's own desktop "Welcome to blinkit" gate (reference
   screenshots) and asked for that same compact, less-intrusive feel where the
   site is still visible behind it. No icons/emoji anywhere in this version,
   per the owner's explicit instruction. All GPS/manual/search LOGIC is
   unchanged -- this is a visual-only pass. */

.axmalg-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    background: rgba(20, 18, 12, 0.25);
    padding: 16px;
}

.axmalg-modal {
    position: absolute;
    top: 84px;
    left: 16px;
    background: #FFFDF8;
    border-radius: 14px;
    padding: 22px 22px;
    max-width: 340px;
    width: calc(100% - 32px);
    box-sizing: border-box;
    text-align: left;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
    font-family: 'Inter', -apple-system, sans-serif;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
}

.axmalg-modal h2 {
    font-family: 'Sora', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #1A1A1A;
    margin: 0 0 6px;
}

.axmalg-sub {
    font-size: 13px;
    color: #6B6558;
    line-height: 1.5;
    margin: 0 0 18px;
}

.axmalg-divider {
    display: flex;
    align-items: center;
    text-align: center;
    color: #A39C8A;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 4px 0 12px;
}
.axmalg-divider::before,
.axmalg-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #E4DFD3;
}
.axmalg-divider span { padding: 0 10px; }

@media (max-width: 480px) {
    .axmalg-modal {
        top: 64px;
        left: 8px;
        width: calc(100% - 16px);
        max-width: none;
    }
}

.axmalg-btn {
    display: block;
    width: 100%;
    padding: 13px 16px;
    border-radius: 12px;
    font-size: 14.5px;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    border: none;
    margin-bottom: 10px;
}

.axmalg-btn-primary { background: #FFC229; color: #1A1A1A; }
.axmalg-btn-primary:hover { background: #F0B00F; }
.axmalg-btn-primary:disabled { opacity: 0.6; cursor: default; }

.axmalg-btn-outline {
    background: transparent;
    color: #6B6558;
    border: none;
    width: auto;
    display: inline-block;
    padding: 4px 0;
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
}
.axmalg-btn-outline:hover { color: #1A1A1A; }

.axmalg-search-row { position: relative; margin-bottom: 10px; text-align: left; }
.axmalg-search-row input {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #E4DFD3;
    border-radius: 10px;
    font-size: 14px;
    box-sizing: border-box;
}
.axmalg-search-row ul {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    border: 1px solid #E4DFD3;
    border-radius: 10px;
    max-height: 160px;
    overflow-y: auto;
    background: #fff;
    position: absolute;
    width: 100%;
    z-index: 2;
}
.axmalg-search-row li {
    padding: 9px 12px;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
    border-bottom: 1px solid #F2EEE2;
}
.axmalg-search-row li:last-child { border-bottom: none; }
.axmalg-search-row li:hover { background: #FFF7E0; }

.axmalg-manual-form { text-align: left; margin-top: 4px; }
.axmalg-input-row { margin-bottom: 12px; }
.axmalg-input-row label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: #6B6558;
    margin-bottom: 5px;
}
.axmalg-input-row input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #E4DFD3;
    border-radius: 10px;
    font-size: 16px;
    box-sizing: border-box;
    background: #FFFDF8;
}
.axmalg-input-row input:focus { outline: none; border-color: #FFC229; background: #fff; }

.axmalg-input-row-group { display: flex; gap: 10px; }
.axmalg-input-row-group .axmalg-input-row { flex: 1; }

.axmalg-status {
    font-size: 12.5px;
    font-weight: 600;
    min-height: 16px;
    margin-top: 4px;
}
.axmalg-status.axmalg-status-error { color: #C0392B; }
.axmalg-status.axmalg-status-info { color: #6B6558; }

@media (max-width: 420px) {
    .axmalg-modal { padding: 22px 18px; }
}

/* v1.0.6: location-drift-detection banner — a small, dismissible nudge
   (never a blocking modal), shown while browsing if the visitor's live GPS
   position has drifted noticeably from their saved delivery location. Plain
   text only, no icons, same brand palette as the rest of this plugin. */

.axmalg-drift-banner {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 999990;
    background: #FFFDF8;
    border: 1px solid #E4DFD3;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
    padding: 14px 16px;
    font-family: 'Inter', -apple-system, sans-serif;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    max-width: 480px;
}

.axmalg-drift-text {
    font-size: 13px;
    color: #1A1A1A;
    line-height: 1.4;
    flex: 1 1 220px;
}

.axmalg-drift-link {
    background: transparent;
    border: none;
    padding: 0;
    font-size: 13px;
    font-weight: 700;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    text-decoration: underline;
    white-space: nowrap;
}

#axmalg-drift-update.axmalg-drift-link { color: #1A1A1A; }
#axmalg-drift-update.axmalg-drift-link:disabled { opacity: 0.6; cursor: default; }
#axmalg-drift-dismiss.axmalg-drift-link { color: #6B6558; }

@media (max-width: 480px) {
    .axmalg-drift-banner {
        left: 8px;
        right: 8px;
        bottom: 8px;
        max-width: none;
    }
}
