/*
 * LocaliaPlus
 * Estilos de Mi cuenta
 */

.mdx-account {
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    padding: 24px 16px;
    box-sizing: border-box;
}

.mdx-account *,
.mdx-account *::before,
.mdx-account *::after {
    box-sizing: border-box;
}

.mdx-account-card {
    width: 100%;
}

.mdx-account h2,
.mdx-account h3 {
    line-height: 1.3;
    margin-bottom: 16px;
}

.mdx-account p {
    line-height: 1.6;
}

.mdx-account .mdx-form-field {
    margin-bottom: 18px;
}

.mdx-account .mdx-form-field > label {
    display: block;
    margin-bottom: 7px;
    font-size: 15px;
    font-weight: 500;
}

.mdx-account .mdx-form-field input[type="text"],
.mdx-account .mdx-form-field input[type="email"],
.mdx-account .mdx-form-field input[type="password"],
.mdx-account .mdx-form-field input[type="tel"],
.mdx-account .mdx-form-field input[type="url"] {
    display: block;
    width: 100%;
    min-height: 46px;
    padding: 10px 13px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    background: #ffffff;
    color: #172033;
    font: inherit;
    font-size: 16px;
}

.mdx-account .mdx-form-field input:focus {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
    border-color: #2563eb;
}

.mdx-account .mdx-form-consent label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-weight: 400;
    line-height: 1.5;
}

.mdx-account .mdx-form-consent input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 3px 0 0;
    flex-shrink: 0;
}

.mdx-account button.mdx-account-primary,
.mdx-account button.mdx-account-secondary,
.mdx-account a.mdx-account-secondary {
    display: inline-block;
    padding: 12px 20px;
    border-radius: 7px;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.mdx-account button.mdx-account-primary {
    background: #172b4d;
    color: #ffffff;
    border: 1px solid #172b4d;
}

.mdx-account button.mdx-account-secondary,
.mdx-account a.mdx-account-secondary {
    background: #ffffff;
    color: #172b4d;
    border: 1px solid #b8c3d1;
}

.mdx-account button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.mdx-account .mdx-registration-options {
    margin-top: 24px;
}

.mdx-account .mdx-registration-option {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 5px;
    margin: 12px 0;
    padding: 17px 20px;
    border: 1px solid #d1d9e4;
    border-radius: 9px;
    background: #ffffff;
    color: #172033;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.mdx-account .mdx-registration-option strong {
    font-size: 16px;
    font-weight: 600;
}

.mdx-account .mdx-registration-option span {
    font-size: 14px;
    line-height: 1.5;
}

.mdx-account .mdx-registration-option:hover {
    border-color: #64748b;
    background: #f8fafc;
}

.mdx-account .mdx-user-registration-form,
.mdx-account .mdx-business-registration-form {
    padding: 22px 0;
}

.mdx-account [hidden] {
    display: none !important;
}

@media (max-width: 600px) {
    .mdx-account {
        padding: 16px 12px;
    }

    .mdx-account .mdx-registration-option {
        padding: 15px;
    }

    .mdx-account button.mdx-account-primary {
        width: 100%;
    }
}

/*
 * LocaliaPlus
 * Dashboard del Administrador de Negocio
 */

.mdx-account:has(.mdx-business-dashboard) {
    max-width: 1200px;
}

.mdx-business-dashboard {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 32px;
    align-items: start;
}

.mdx-dashboard-sidebar {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 24px 18px;
}

.mdx-dashboard-sidebar h3 {
    margin-top: 0;
    font-size: 19px;
    color: #172b4d;
}

.mdx-dashboard-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mdx-dashboard-sidebar li {
    padding: 12px 10px;
    border-radius: 6px;
    color: #334155;
}

.mdx-dashboard-sidebar li:first-child {
    background: #dbeafe;
    font-weight: 600;
}

.mdx-dashboard-content {
    min-width: 0;
    padding: 12px 0;
}

/*
 * Adaptaci贸n a pantallas peque帽as.
 */
@media (max-width: 767px) {

    .mdx-business-dashboard {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .mdx-dashboard-sidebar {
        padding: 18px;
    }

    .mdx-dashboard-content {
        padding: 0;
    }
}

/*
 * Campos de ubicación del dashboard comercial.
 */
.mdx-business-dashboard .mdx-listing-location-fields input[type="text"] {
    display: block;
    width: 100%;
    max-width: 560px;
    min-height: 44px;
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    background: #ffffff;
    color: #172033;
    font: inherit;
}

.mdx-business-dashboard #mdx-geocode-address {
    padding: 11px 18px;
    border: 1px solid #172b4d;
    border-radius: 7px;
    background: #172b4d;
    color: #ffffff;
    font: inherit;
    cursor: pointer;
}

.mdx-business-dashboard #mdx-geocode-address:disabled {
    opacity: 0.55;
    cursor: wait;
}

/* Descripción comercial en el dashboard */
.mdx-account .mdx-form-field textarea {
    display: block;
    width: 100%;
    min-height: 180px;
    padding: 12px 13px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    background: #ffffff;
    color: #172033;
    font: inherit;
    font-size: 16px;
    line-height: 1.6;
    resize: vertical;
}

.mdx-account .mdx-form-field textarea:focus {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
    border-color: #2563eb;
}


/*
 * LocaliaPlus
 * Horarios comerciales del dashboard frontend
 */

.mdx-listing-business-hours {
    margin-top: 32px;
}

.mdx-listing-business-hours > h3 {
    margin-bottom: 12px;
}

.mdx-listing-business-hours > p {
    margin-bottom: 24px;
}

.mdx-business-hours-day {
    padding: 18px 20px;
    margin-bottom: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    background: #ffffff;
}

.mdx-business-hours-day h4 {
    margin: 0 0 16px;
    font-size: 16px;
    font-weight: 600;
    color: #172b4d;
}

.mdx-business-hours-times {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.mdx-business-hours-times .mdx-form-field {
    min-width: 0;
    margin-bottom: 14px;
}

.mdx-account .mdx-business-hours-times input[type="time"] {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    background: #ffffff;
    color: #172033;
    font: inherit;
    font-size: 15px;
}

.mdx-account .mdx-business-hours-times input[type="time"]:focus {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
    border-color: #2563eb;
}

.mdx-business-hours-options {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}

.mdx-business-hours-options label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: #334155;
    cursor: pointer;
}

.mdx-account .mdx-business-hours-options input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 0;
    flex-shrink: 0;
}

/*
 * Adaptación a pantallas pequeñas.
 */

@media (max-width: 600px) {

    .mdx-business-hours-day {
        padding: 16px;
    }

    .mdx-business-hours-times {
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
    }

    .mdx-business-hours-options {
        gap: 18px;
    }
}

/* Elementos del formulario de publicaciones */
#mdx-publication-items .mdx-publication-item {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

#mdx-publication-items .mdx-publication-item > .mdx-form-field {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
}

#mdx-publication-items .mdx-publication-item input[type="text"],
#mdx-publication-items .mdx-publication-item textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

/* LocaliaPlus: organizador de publicaciones */

.mdx-publication-organizer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 24px;
}

.mdx-publication-organizer-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.045);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.mdx-publication-organizer-item:hover {
    border-color: #a5b4fc;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.mdx-publication-organizer-item h3 {
    margin: 0;
    font-size: 19px;
    font-weight: 700;
}

.mdx-publication-organizer-item p {
    margin: 0;
    line-height: 1.5;
}

.mdx-publication-organizer-item .mdx-account-secondary {
    margin-top: auto;
    align-self: flex-start;
}

@media (max-width: 650px) {
    .mdx-publication-organizer {
        grid-template-columns: 1fr;
    }
}

/* Estado de las publicaciones */

.mdx-publication-status {
    align-self: flex-start;
    padding: 6px 12px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #374151;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
}

/* LocaliaPlus: colores de estado de publicaciones */

.mdx-publication-status.mdx-status-publish {
    background: #dcfce7;
    color: #166534;
}

.mdx-publication-status.mdx-status-pending {
    background: #dbeafe;
    color: #1e40af;
}

.mdx-publication-status.mdx-status-draft {
    background: #fef3c7;
    color: #92400e;
}

.mdx-publication-status.mdx-status-future {
    background: #ede9fe;
    color: #5b21b6;
}

.mdx-publication-status.mdx-status-private {
    background: #fce7f3;
    color: #9d174d;
}

.mdx-publication-status.mdx-status-empty {
    background: #f3f4f6;
    color: #6b7280;
}

/* LocaliaPlus: distintivo de suspensión por moderación */
.mdx-publication-status.mdx-status-suspended {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* Estados de vigencia de publicaciones */

.mdx-publication-status.mdx-status-active {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.mdx-publication-status.mdx-status-scheduled {
    background: #dbeafe;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

.mdx-publication-status.mdx-status-expired {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

/* MDX Core: organización de imágenes del espacio comercial */

.mdx-business-dashboard .mdx-business-images-primary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
}

.mdx-business-dashboard .mdx-business-image-card {
    min-width: 0;
}

.mdx-business-dashboard .mdx-business-image-card img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.mdx-business-dashboard .mdx-business-gallery {
    margin-top: 32px;
}

.mdx-business-dashboard .mdx-business-gallery-preview {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 16px 0;
}

.mdx-business-dashboard .mdx-business-gallery-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    min-height: 125px;
    padding: 10px;
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 9px;
    text-align: center;
}

.mdx-business-dashboard .mdx-business-gallery-plus {
    font-size: 32px;
    font-weight: 300;
    line-height: 1;
    color: #64748b;
}

.mdx-business-dashboard .mdx-business-gallery-slot-label {
    font-size: 12px;
    color: #64748b;
}

.mdx-business-dashboard .mdx-business-gallery-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 12px;
    cursor: pointer;
}

.mdx-business-dashboard .mdx-business-gallery-item img {
    display: block;
    width: 100% !important;
    height: 100px !important;
    object-fit: cover;
    border-radius: 8px;
}

@media (max-width: 767px) {
    .mdx-business-dashboard .mdx-business-images-primary {
        grid-template-columns: 1fr;
    }

    .mdx-business-dashboard .mdx-business-gallery-preview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* MDX Core: fondo de la sección de fotografías */

.mdx-business-dashboard .mdx-business-images-primary,
.mdx-business-dashboard .mdx-business-gallery {
    background: #dbeafe;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
}

.mdx-business-dashboard .mdx-business-image-card {
    background: #ffffff;
    border-radius: 9px;
    padding: 18px;
}

.mdx-business-dashboard .mdx-business-image-card p,
.mdx-business-dashboard .mdx-business-gallery p {
    font-size: 14px;
    line-height: 1.5;
}


/* MDX Core: tarjeta azul de ubicaci髇 comercial (solo presentaci髇). */
.mdx-business-dashboard .mdx-business-location-card {
    margin-top: 32px;
    padding: 24px;
    background: #dbeafe;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}
.mdx-business-dashboard .mdx-business-location-card > h3 {
    margin-top: 0;
    margin-bottom: 20px;
}
.mdx-business-dashboard .mdx-business-location-card > p {
    margin-bottom: 18px;
}
.mdx-business-dashboard .mdx-business-location-card #mdx_address,
.mdx-business-dashboard .mdx-business-location-card #mdx_postcode {
    display: block;
    width: 100%;
    max-width: 100%;
    min-height: 46px;
    padding: 10px 13px;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    font: inherit;
    color: #172033;
}
@media (max-width: 600px) {
    .mdx-business-dashboard .mdx-business-location-card { padding: 16px; }
}

/* MDX Core: tarjeta azul del horario comercial. Solo presentacion. */
.mdx-business-dashboard .mdx-listing-business-hours {
 margin-top: 32px; padding: 24px; background: #dbeafe;
 border: 1px solid #e2e8f0; border-radius: 12px;
}
.mdx-business-dashboard .mdx-listing-business-hours > h3 { margin-top: 0; }
.mdx-business-dashboard .mdx-listing-business-hours > .mdx-business-hours-day:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
 .mdx-business-dashboard .mdx-listing-business-hours { padding: 16px; }
}
