/* ============================================================
   NAGALAND ME EXPERTS — FRONTEND STYLES
   Plugin-specific CSS that complements the child theme
   ============================================================ */

.nme-tier-badge {
    display: inline-block;
    vertical-align: middle;
}

/* Form labels */
.nme-card label {
    display: block;
    font-weight: 600;
    color: #0F2419;
    margin-bottom: 6px;
    font-size: 0.95rem;
}

.nme-card input[type="text"],
.nme-card input[type="email"],
.nme-card input[type="tel"],
.nme-card input[type="url"],
.nme-card input[type="number"],
.nme-card input[type="file"],
.nme-card textarea,
.nme-card select {
    width: 100%;
    padding: 12px 16px;
    border: 1.5px solid #E5E7EB;
    border-radius: 12px;
    font-family: inherit;
    font-size: 1rem;
    transition: all 0.3s ease;
    background: #fff;
}

.nme-card input:focus,
.nme-card textarea:focus,
.nme-card select:focus {
    outline: none;
    border-color: #10B981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15);
}

.nme-card h3 {
    color: #0A7558;
    border-bottom: 2px solid #FAF7F0;
    padding-bottom: 8px;
    margin-top: 28px;
    margin-bottom: 16px;
}

.nme-card h3:first-child {
    margin-top: 0;
}

/* Section titles */
.nme-card .nme-section-title {
    color: #0A7558;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.85rem;
    margin-bottom: 16px;
}

/* ============================================================
   v0.3.0 — production polish
   ============================================================ */

/* Keyboard-focus outlines so tab-users never get lost. */
.nme-btn:focus-visible,
.nme-card a:focus-visible,
.nme-card button:focus-visible,
.nme-card input:focus-visible,
.nme-card textarea:focus-visible,
.nme-card select:focus-visible {
    outline: 3px solid #D4A843;
    outline-offset: 2px;
}

/* Card hover lift — directory cards feel tactile. */
a.nme-card {
    transition: transform .15s ease, box-shadow .15s ease;
}
a.nme-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Grid fallback — the inline styles use `auto-fill` already, but for
   any places still using the legacy nme-grid-N classes, collapse to
   a single column on narrow screens. */
@media (max-width: 640px) {
    .nme-grid-2,
    .nme-grid-3,
    .nme-grid-4 {
        display: grid;
        grid-template-columns: 1fr !important;
        gap: 14px;
    }
    .nme-card {
        padding: 18px;
    }
    .nme-profile-badges {
        margin-left: 0 !important;
        margin-top: 6px;
    }
}

/* Respect reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
    a.nme-card,
    .nme-btn,
    .nme-card input,
    .nme-card textarea,
    .nme-card select {
        transition: none !important;
    }
}

/* Hide noisy chrome on print so printed profile pages stay clean. */
@media print {
    .nme-profile-badges,
    a.nme-btn,
    form {
        display: none !important;
    }
    .nme-card {
        border: 1px solid #E5E7EB !important;
        box-shadow: none !important;
        break-inside: avoid;
    }
}
