/* ==========================================================================
   MM Support — Divi 5 Integration Overrides
   Loaded only on the Support Portal page when Divi is active.
   Brand system: martinsmoscoso.com
   Version: 1.1.0
   ========================================================================== */

/* ── Page-level: dark background, remove Divi's white canvas ────────────── */
.mm-page-support-portal #page-container,
.mm-page-support-portal #et-main-area,
.mm-page-support-portal .et_pb_section {
    background-color: #100e0d;
}

/* ── Section: strip the orange/coloured Divi background ─────────────────── */
.mm-page-support-portal .et_pb_section {
    background-color: #100e0d !important;
    padding-top: 60px;
    padding-bottom: 80px;
}

/* First section gets the top accent treatment the portal card adds itself */
.mm-page-support-portal .et_pb_section.et_pb_section_0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* ── Row: strip padding, let the .mm-portal card breathe naturally ───────── */
.mm-page-support-portal .et_pb_row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    max-width: 100%;
    width: 100%;
}

/* ── Column: no padding ─────────────────────────────────────────────────── */
.mm-page-support-portal .et_pb_column {
    padding: 0 !important;
}

/* ── Code module inner wrapper: flush the portal card to the edges ───────── */
.mm-page-support-portal .et_pb_code_inner {
    padding: 0 !important;
}

/* ── Allow footer full-bleed breakout: remove overflow clipping ──────────── */
/* The .mm-portal-footer uses width:100vw + translate trick to escape column. */
/* Without overflow:visible on ancestors, Divi clips it. */
.mm-page-support-portal .et_pb_section,
.mm-page-support-portal .et_pb_row,
.mm-page-support-portal .et_pb_column,
.mm-page-support-portal .et_pb_code_inner {
    overflow: visible !important;
}

/* ── Divi's built-in page title module (et_pb_post_title) ───────────────── */
.mm-page-support-portal .et_pb_title_container h1.entry-title,
.mm-page-support-portal .et_pb_post_title h1 {
    font-family: 'Bebas Neue', Arial, sans-serif;
    font-weight: 400;
    letter-spacing: .06em;
    color: #efebeb;
    font-size: 3rem;
    margin-bottom: 0;
}

/* ── Divi Text module used as page heading ───────────────────────────────── */
.mm-page-support-portal .et_pb_text h1,
.mm-page-support-portal .et_pb_text h2 {
    font-family: 'Bebas Neue', Arial, sans-serif;
    font-weight: 400;
    letter-spacing: .06em;
    color: #efebeb;
}

/* ── Body background: the mm-page-support-portal class IS on body ────────── */
/* Selector must be body.mm-page-support-portal (not .mm-page .body) */
body.mm-page-support-portal {
    background-color: #100e0d !important;
}

/* ── Hide Divi breadcrumbs if present ───────────────────────────────────── */
.mm-page-support-portal .et_pb_breadcrumbs {
    display: none;
}

/* ── Divi's sidebar removal (force full-width) ───────────────────────────── */
.mm-page-support-portal #sidebar {
    display: none !important;
}

.mm-page-support-portal #main-content .container {
    max-width: 100%;
    padding: 0;
}

/* ── The .mm-portal card: add page-level breathing room ─────────────────── */
.mm-page-support-portal .mm-portal {
    margin: 0 auto;
    max-width: 960px;
    padding: 60px 48px 80px;
}

/* ── Reset Divi's global link colour inside the portal ─────────────────── */
/* Divi 5 applies a global `a { color: var(--divi-link-color); }` which
   sets ALL links (including buttons) to orange. We reset to inherit so
   each component uses the colour set by portal.css.                       */
body.mm-page-support-portal .mm-portal a {
    color: inherit;
    -webkit-text-fill-color: inherit;
}

/* ── Force text-align left inside the portal ───────────────────────────── */
/* Divi sections/columns default to text-align:center. The portal layout
   is left-aligned by design.                                              */
body.mm-page-support-portal .mm-portal {
    text-align: left !important;
}

body.mm-page-support-portal .mm-portal .mm-portal-header,
body.mm-page-support-portal .mm-portal .mm-form,
body.mm-page-support-portal .mm-portal .mm-form-row,
body.mm-page-support-portal .mm-portal .mm-filter-bar,
body.mm-page-support-portal .mm-portal .mm-table {
    text-align: left !important;
}

/* ── Primary button: force white text on orange background ─────────────── */
/* Needs body-level specificity to beat Divi's global `a` colour rule.     */
body.mm-page-support-portal .mm-portal a.mm-btn-primary,
body.mm-page-support-portal .mm-portal button.mm-btn-primary {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body.mm-page-support-portal .mm-portal a.mm-btn-primary:hover,
body.mm-page-support-portal .mm-portal button.mm-btn-primary:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* ── Secondary button: force orange text / white on hover ──────────────── */
body.mm-page-support-portal .mm-portal a.mm-btn-secondary,
body.mm-page-support-portal .mm-portal button.mm-btn-secondary {
    color: #fa4600 !important;
    -webkit-text-fill-color: #fa4600 !important;
}

body.mm-page-support-portal .mm-portal a.mm-btn-secondary:hover,
body.mm-page-support-portal .mm-portal button.mm-btn-secondary:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* ── Back link: muted gray, not Divi's orange ──────────────────────────── */
body.mm-page-support-portal .mm-portal a.mm-back-link {
    color: #818191 !important;
    -webkit-text-fill-color: #818191 !important;
}

body.mm-page-support-portal .mm-portal a.mm-back-link:hover {
    color: #fa4600 !important;
    -webkit-text-fill-color: #fa4600 !important;
}

/* ── Table links: secondary text, orange ticket numbers ────────────────── */
body.mm-page-support-portal .mm-portal .mm-table a {
    color: #efebeb;
    -webkit-text-fill-color: #efebeb;
}

body.mm-page-support-portal .mm-portal .mm-table a:hover {
    color: #fa4600;
    -webkit-text-fill-color: #fa4600;
}

body.mm-page-support-portal .mm-portal .mm-table td:first-child a {
    color: #fa4600;
    -webkit-text-fill-color: #fa4600;
}

/* ── Footer links: keep their own colours ──────────────────────────────── */
body.mm-page-support-portal .mm-portal-footer a {
    color: inherit;
    -webkit-text-fill-color: inherit;
}

/* ── Ghost buttons (pagination): inherit portal styling ────────────────── */
body.mm-page-support-portal .mm-portal button.mm-btn-ghost {
    color: #efebeb !important;
    -webkit-text-fill-color: #efebeb !important;
}

body.mm-page-support-portal .mm-portal button.mm-btn-ghost:hover:not(:disabled) {
    color: #fa4600 !important;
    -webkit-text-fill-color: #fa4600 !important;
}

/* ── Form inputs: override Divi's default white backgrounds ─────────────── */
/* Divi applies input[type="text"] { background:#fff; color:#333; } globally. */
/* body.mm-page-support-portal gives us higher specificity. */
body.mm-page-support-portal input[type="text"],
body.mm-page-support-portal input[type="email"],
body.mm-page-support-portal input[type="url"],
body.mm-page-support-portal input[type="tel"],
body.mm-page-support-portal input[type="number"],
body.mm-page-support-portal select,
body.mm-page-support-portal textarea {
    background-color: #1c1917 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 0px !important;
}

body.mm-page-support-portal input::placeholder,
body.mm-page-support-portal textarea::placeholder {
    color: #8e8e9e !important;
    -webkit-text-fill-color: #8e8e9e !important;
    opacity: 1;
}

body.mm-page-support-portal input:focus,
body.mm-page-support-portal textarea:focus,
body.mm-page-support-portal select:focus {
    border-color: #fa4600 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(250, 70, 0, 0.12) !important;
}

/* ── Guest landing: keep CTA blocks centered ───────────────────────────── */
body.mm-page-support-portal .mm-portal.mm-portal-guest .mm-guest-block {
    text-align: center !important;
}

body.mm-page-support-portal .mm-portal.mm-portal-guest .mm-guest-track,
body.mm-page-support-portal .mm-portal.mm-portal-guest .mm-guest-track h3,
body.mm-page-support-portal .mm-portal.mm-portal-guest .mm-guest-track p,
body.mm-page-support-portal .mm-portal.mm-portal-guest .mm-lookup-form {
    text-align: left !important;
}

/* ── Visual readability improvements ────────────────────────────────────── */
/* Slightly larger, lighter fonts for better contrast on the dark surface. */

/* Guest landing headings */
body.mm-page-support-portal .mm-portal .mm-guest-block h2 {
    font-size: 2.4rem !important;
    color: #fdfcfc !important;
    letter-spacing: .07em !important;
}

body.mm-page-support-portal .mm-portal .mm-guest-block h3 {
    font-size: 1.8rem !important;
    color: #efebeb !important;
    letter-spacing: .07em !important;
}

/* Guest landing body text */
body.mm-page-support-portal .mm-portal .mm-guest-block p {
    font-size: 16px !important;
    color: #ccc8c7 !important;
    font-weight: 300 !important;
    line-height: 1.7 !important;
}

/* Dashboard heading */
body.mm-page-support-portal .mm-portal .mm-portal-header h2 {
    font-size: 2.6rem !important;
    color: #fdfcfc !important;
}

/* Form labels */
body.mm-page-support-portal .mm-portal .mm-form-row label {
    font-size: 13px !important;
    color: #ccc8c7 !important;
    font-weight: 600 !important;
}

/* Filter labels */
body.mm-page-support-portal .mm-portal .mm-filter-label {
    color: #ccc8c7 !important;
}

/* Empty state */
body.mm-page-support-portal .mm-portal .mm-empty p {
    font-size: 16px !important;
    color: #ccc8c7 !important;
    font-weight: 300 !important;
}

/* ── Responsive: mobile adjustments for Divi context ────────────────────── */
@media (max-width: 980px) {
    .mm-page-support-portal .et_pb_section {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .mm-page-support-portal .mm-portal {
        padding: 40px 24px 60px;
    }
}

@media (max-width: 767px) {
    .mm-page-support-portal .mm-portal {
        padding: 32px 16px 48px;
    }
}
