/* =========================================================
   PRINTAMETRO - CUSTOM.CSS
   Tema: printametro (child do Classic)
   ========================================================= */

/* Adobe Fonts */
@import url("https://use.typekit.net/xom8qsi.css");


/* =========================================================
   1. VARIÁVEIS / IDENTIDADE
   ========================================================= */

:root {
    --pm-blue: #2c4c97;
    --pm-blue-dark: #203c7d;
    --pm-pink: #c4007a;
    --pm-cyan: #00aeea;

    --pm-text: #222222;
    --pm-muted: #6c757d;
    --pm-light: #ffffff;
    --pm-gray: #f5f5f7;
    --pm-border: #e6e6e6;

    --pm-radius: 10px;
    --pm-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);

    --pm-container: 1450px;
}


/* =========================================================
   2. BASE
   ========================================================= */

html,
body {
    margin: 0;
    padding: 0;
}

body {
    background: #fff;
    color: var(--pm-text);
    font-family: "univia-pro", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
.product-title,
.block-title,
.btn {
    font-family: "univia-pro", sans-serif;
}

a {
    color: var(--pm-blue);
    text-decoration: none;
    transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
    color: var(--pm-pink);
    text-decoration: none;
}

.container {
    width: 100%;
    max-width: var(--pm-container);
}

.btn-primary {
    background: var(--pm-blue);
    border: 0;
    border-radius: var(--pm-radius);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: var(--pm-pink);
    border-color: var(--pm-pink);
}

#_desktop_top_menu .top-menu > .current > a,
#_desktop_top_menu .top-menu > li > a[data-depth="0"]:hover {
    color: var(--pm-blue) !important;
}


/* =========================================================
   3. PRINTAMETRO - MULTIPLE FILE UPLOAD
   ========================================================= */

.printametro-native-field {
    display: none;
}

.printametro-upload {
    margin: 20px 0;
    padding: 20px;
    border: 1px solid #ddd;
    background: #fff;
}

.printametro-upload-header {
    margin-bottom: 15px;
}

.printametro-upload-header p {
    margin-bottom: 5px;
}

.printametro-upload-description {
    font-size: 14px;
}

.printametro-upload-button-wrapper {
    margin: 20px 0;
}

.printametro-file-selector {
    display: none;
}

.printametro-select-files {
    cursor: pointer;
}

.printametro-upload-error {
    display: none;
    margin: 15px 0;
    padding: 10px;
    border: 1px solid #dc3545;
    color: #dc3545;
}

.printametro-file-list {
    margin-top: 15px;
}

.printametro-file-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.printametro-file-info {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.printametro-file-name {
    font-weight: 600;
    word-break: break-word;
}

.printametro-file-size {
    font-size: 12px;
    opacity: 0.7;
}

.printametro-remove-file {
    flex-shrink: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font-size: 13px;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

button.printametro-remove-file {
    font-size: 22px;
}

.printametro-remove-file:hover {
    text-decoration: underline;
}

.printametro-file-counter {
    margin-top: 15px;
    font-size: 13px;
    font-weight: 600;
}


/* =========================================================
   4. PRINTAMETRO - FICHEIROS ENVIADOS
   ========================================================= */

.printametro-saved-files {
    margin-top: 20px;
}

.printametro-saved-files h5 {
    margin-bottom: 5px;
}

.printametro-saved-files-list {
    width: 100%;
    margin-top: 12px;
    border: 1px solid #ddd;
    overflow: hidden;
}

.printametro-saved-file-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: 100%;
    min-height: 58px;
    padding: 10px 12px;
    box-sizing: border-box;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    gap: 12px;
}

.printametro-saved-file-row:last-child {
    border-bottom: 0;
}

.printametro-saved-file-icon {
    display: block;
    flex: 0 0 42px !important;
    width: 42px;
}

.printametro-saved-file-icon .printametro-file-icon {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 38px;
    box-sizing: border-box;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
}

.printametro-saved-file-icon .printametro-pdf-icon {
    background: #444;
}

.printametro-saved-file-icon .printametro-png-icon {
    background: #3155a4;
}

.printametro-saved-file-name {
    flex: 1 1 auto !important;
    min-width: 0;
    overflow: hidden;
}

.printametro-saved-file-name strong {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    line-height: 1.4;
}

.printametro-saved-file-action {
    flex: 0 0 auto !important;
    margin-left: auto;
}


/* =========================================================
   5. PRINTAMETRO - FICHEIROS NAS ENCOMENDAS
   ========================================================= */

.printametro-order-file {
    margin-bottom: 8px;
}

.printametro-order-file-link {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    max-width: 650px;
    padding: 10px 14px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    background: #fff;
    color: #363a41;
    text-decoration: none !important;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.printametro-order-file-link:hover {
    border-color: var(--pm-blue);
    background: #f8faff;
    color: #363a41;
    text-decoration: none !important;
}

.printametro-order-file-link .printametro-file-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    background: #f1f3f5;
    color: #555;
    font-size: 11px;
    font-weight: 700;
}

.printametro-order-file-info {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.printametro-order-file-info strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
}

.printametro-order-file-info span {
    font-size: 12px;
    color: #6c868e;
}

.printametro-file-download {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    background: #f1f3f5;
    color: #363a41;
    font-size: 16px;
    font-weight: 600;
}

.printametro-order-file-link:hover .printametro-file-download {
    background: var(--pm-blue);
    color: #fff;
}


/* =========================================================
   6. HEADER PRINTAMETRO
   ========================================================= */

#header {
    position: relative;
    z-index: 100;
    background: #fff;
}

#header .header-banner:empty {
    display: none;
}


/* ---------- TOP BAR ---------- */

#header .printametro-topbar {
    min-height: 34px;
    margin: 0;
    padding: 0;
    border: 0;
    background: var(--pm-blue);
    box-shadow: none;
}

#header .printametro-topbar .container {
    width: 100%;
    max-width: var(--pm-container);
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

.printametro-topbar-inner {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.printametro-topbar-left,
.printametro-topbar-right {
    display: flex;
    align-items: center;
    min-width: 0;
}

.printametro-topbar-left > *,
.printametro-topbar-right > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

#header .printametro-topbar,
#header .printametro-topbar a,
#header .printametro-topbar .material-icons {
    color: #fff;
}

#header .printametro-topbar a {
    font-size: 12px;
    line-height: 34px;
    text-decoration: none;
}

#header .printametro-topbar a:hover {
    color: #fff;
    opacity: 0.78;
}

#header .printametro-topbar .right-nav {
    display: flex;
    align-items: center;
}

#header .printametro-topbar .language-selector,
#header .printametro-topbar .currency-selector,
#header .printametro-topbar .user-info,
#header .printametro-topbar .blockcart {
    margin: 0;
}

#header .printametro-topbar .blockcart {
    min-height: 34px;
    display: flex;
    align-items: center;
    background: transparent;
}

#header .printametro-topbar .blockcart.active,
#header .printametro-topbar .blockcart:hover {
    background: rgba(255, 255, 255, 0.1);
}


/* ---------- HEADER PRINCIPAL ---------- */

#header .printametro-header-main {
    margin: 0;
    padding: 0;
    background: #fff;
    border: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

#header .printametro-header-main > .container {
    width: 100%;
    max-width: var(--pm-container);
    margin: 0 auto;
    padding: 10px 20px;
}

.printametro-header-grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(280px, 340px) minmax(300px, 1fr);
    align-items: center;
    gap: 30px;
    min-height: 76px;
}


/* ---------- LOGO ---------- */

.printametro-header-logo {
    grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.printametro-header-logo h1 {
    margin: 0;
    line-height: 1;
}

.printametro-header-logo a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.printametro-header-logo .logo,
.printametro-header-logo img {
    display: block;
    width: auto;
    max-width: 300px;
    max-height: 64px;
    object-fit: contain;
}


/* ---------- MENU DE CATEGORIAS ---------- */

.printametro-header-categories {
    grid-column: 1;
    min-width: 0;
}

.printametro-header-menu {
    display: contents;
}

.printametro-header-categories #_desktop_top_menu,
.printametro-header-categories .top-menu,
.printametro-header-categories .menu {
    margin: 0;
    padding: 0;
}

.printametro-header-categories .top-menu {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 4px;
}

.printametro-header-categories .top-menu > li {
    margin: 0;
    padding: 0;
}

.printametro-header-categories .top-menu > li > a,
.printametro-header-categories .top-menu > li > a[data-depth="0"] {
    display: block;
    padding: 8px 0;
    color: #111;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
    text-decoration: none;
}

.printametro-header-categories .top-menu > li > a:hover,
.printametro-header-categories .top-menu > li.current > a {
    color: var(--pm-blue) !important;
}


/* ---------- PESQUISA ---------- */

.printametro-header-grid #search_widget,
.printametro-header-grid .search-widget {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 0;
    width: min(100%, 340px);
    max-width: 340px;
    margin: 0;
    transform: translateY(-50%);
}

#header #search_widget form,
#header .search-widget form {
    position: relative;
    width: 100%;
    margin: 0;
}

#header #search_widget form input[type="text"],
#header #search_widget form input[type="search"],
#header .search-widget form input[type="text"],
#header .search-widget form input[type="search"] {
    width: 100%;
    height: 42px;
    margin: 0;
    padding: 0 48px 0 18px;
    border: 1px solid #777;
    border-radius: 24px;
    outline: 0;
    background: #fff;
    color: #222;
    font-size: 13px;
    box-shadow: none;
}

#header #search_widget form input:focus,
#header .search-widget form input:focus {
    border-color: var(--pm-blue);
    box-shadow: 0 0 0 2px rgba(44, 76, 151, 0.08);
}

#header #search_widget form button,
#header .search-widget form button {
    position: absolute;
    top: 50%;
    right: 8px;
    margin: 0;
    padding: 5px 8px;
    border: 0;
    background: transparent;
    transform: translateY(-50%);
}


/* Remove margens/efeitos nativos que interferem com o header */

#header .header-nav,
#header .header-top {
    border: 0;
}

#header .header-top .position-static {
    position: static;
}


/* =========================================================
   7. HOMEPAGE - BANNER FULL WIDTH
   ========================================================= */

/*
 * Alteração mínima:
 * - slider ocupa 100% da largura da viewport
 * - altura é definida naturalmente pela proporção da imagem
 * - sem altura fixa, sem vh e sem object-fit: cover
 */

#index #wrapper {
    overflow-x: hidden;
    padding-top: 0 !important;
}

#index #wrapper > .container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#index #content-wrapper,
#index #main,
#index #content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#index #carousel {
    position: relative;
    left: 50%;

    width: 100vw !important;
    max-width: 100vw !important;

    height: auto !important;

    margin-left: -50vw !important;
    margin-right: 0 !important;

    overflow: hidden;
}

#index #carousel .carousel-inner,
#index #carousel .carousel-item,
#index #carousel .carousel-item figure {
    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;
}

#index #carousel .carousel-item img {
    display: block;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;

    margin: 0 !important;
}

/* =========================================================
   8. HOMEPAGE - PRODUTOS POPULARES
   ========================================================= */

#index .featured-products {
    width: 100%;
    max-width: var(--pm-container);
    margin: 0 auto;
    padding: 52px 24px 70px;
}

#index .featured-products .products-section-title {
    margin: 0 0 36px;
    color: #222;
    font-size: 25px;
    font-weight: 700;
    text-align: center;
}

#index .featured-products .products {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
}

#index .featured-products .product-miniature {
    margin: 0;
}

#index .featured-products .product-miniature .thumbnail-container {
    height: auto;
    min-height: 350px;
    margin: 0;
    border: 1px solid var(--pm-border);
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#index .featured-products .product-miniature .thumbnail-container:hover {
    transform: translateY(-3px);
    box-shadow: var(--pm-shadow);
}

#index .featured-products .product-miniature .product-description {
    position: relative;
    bottom: auto;
    width: 100%;
    background: #fff;
}

#index .featured-products .all-product-link {
    display: table;
    margin: 35px auto 0;
}


/* =========================================================
   9. TABLET
   ========================================================= */

@media (max-width: 1199px) {

    .printametro-header-grid {
        grid-template-columns: minmax(220px, 1fr) 260px minmax(260px, 1fr);
        gap: 18px;
    }

    .printametro-header-logo .logo,
    .printametro-header-logo img {
        max-width: 255px;
        max-height: 58px;
    }

    .printametro-header-categories .top-menu {
        column-gap: 9px;
    }

    .printametro-header-categories .top-menu > li > a,
    .printametro-header-categories .top-menu > li > a[data-depth="0"] {
        font-size: 11px;
    }

    .printametro-header-grid #search_widget,
    .printametro-header-grid .search-widget {
        max-width: 265px;
    }

}


/* =========================================================
   10. MOBILE
   ========================================================= */

@media (max-width: 767px) {

    #header .printametro-topbar {
        min-height: 52px;
    }

    #header .printametro-topbar .container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .printametro-mobile-nav {
        position: relative;
        min-height: 52px;
        display: block;
    }

    #header #menu-icon {
        margin-top: 0;
        line-height: 52px;
    }

    #header .top-logo {
        position: absolute;
        top: 50%;
        left: 50%;
        margin: 0;
        transform: translate(-50%, -50%);
    }

    #header .top-logo img {
        width: auto;
        max-width: 175px;
        max-height: 40px;
    }

    #header .printametro-header-main {
        padding: 0;
        box-shadow: none;
    }

    #header .printametro-header-main > .container {
        padding-top: 0;
        padding-bottom: 0;
    }

    #mobile_top_menu_wrapper {
        margin: 0;
        padding: 15px;
        background: #fff;
    }

    #index .featured-products {
        padding: 38px 15px 55px;
    }

    #index .featured-products .products-section-title {
        margin-bottom: 25px;
        font-size: 21px;
    }

}


/* =========================================================
   11. MOBILE PEQUENO
   ========================================================= */

@media (max-width: 480px) {

    #header .top-logo img {
        max-width: 150px;
    }

    #index .featured-products {
        padding-left: 12px;
        padding-right: 12px;
    }

    .printametro-upload {
        padding: 15px;
    }

    .printametro-saved-file-row {
        gap: 8px;
        padding: 9px;
    }

}

/* =========================================================
   PESQUISA - CORREÇÃO ESPECÍFICA DA LUPA
   Estrutura real do ps_searchbar:
   #search_widget > form > i.material-icons.search + input[name="s"]
   ========================================================= */

#header #search_widget form {
    position: relative;
}

#header #search_widget i.material-icons.search {
    position: absolute;
    top: 50%;
    left: 12px;
    z-index: 2;

    margin: 0;
    padding: 0;

    transform: translateY(-50%);
    pointer-events: none;
}

#header #search_widget input[name="s"] {
    box-sizing: border-box;
    padding-left: 48px !important;
}

/* =========================================================
   MOBILE - HEADER / LOGO / PESQUISA
   Ajuste específico para evitar sobreposição do logo
   com a barra de pesquisa.
   ========================================================= */

@media (max-width: 767px) {

    /* Linha superior do header */
    #header .header-nav {
        min-height: 58px !important;
        height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #header .header-nav .mobile {
        position: relative !important;
        min-height: 58px !important;
        height: 58px !important;
    }

    /* Logo centrado e totalmente visível */
    #header .top-logo,
    #header #_mobile_logo {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        bottom: auto !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;

        transform: translate(-50%, -50%) !important;
        z-index: 2 !important;
    }

    #header .top-logo img,
    #header #_mobile_logo img {
        display: block !important;

        width: auto !important;
        max-width: 145px !important;
        max-height: 36px !important;

        margin: 0 auto !important;
    }

    /* Mantém menu e conta/carrinho nas extremidades */
    #header #menu-icon {
        position: absolute !important;
        top: 50% !important;
        left: 15px !important;

        margin: 0 !important;

        transform: translateY(-50%) !important;
        z-index: 3 !important;
    }

    #header .header-nav .right-nav {
        position: absolute !important;
        top: 50% !important;
        right: 10px !important;

        display: flex !important;
        align-items: center !important;

        margin: 0 !important;

        transform: translateY(-50%) !important;
        z-index: 3 !important;
    }

    /* Pesquisa numa linha própria abaixo */
    #header .header-top {
        position: relative !important;
        clear: both !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 10px 12px 12px !important;

        background: #fff !important;
    }

    #header .header-top .container,
    #header .header-top .row,
    #header .header-top .header-top-right {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header #search_widget,
    #header .search-widgets {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;

        float: none !important;
        clear: both !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        transform: none !important;
    }

    #header #search_widget form {
        width: 100% !important;
        margin: 0 !important;
    }

    #header #search_widget input[name="s"] {
        width: 100% !important;
        height: 42px !important;

        box-sizing: border-box !important;
        padding-left: 48px !important;

        border-radius: 22px !important;
    }

    #header #search_widget i.material-icons.search {
        top: 50% !important;
        left: 14px !important;
    }

    /* Evita espaço extra antes do slider */
    #index #wrapper {
        padding-top: 0 !important;
    }
}

/* =========================================================
   MOBILE - ESPAÇAMENTO ENTRE LOGO E PESQUISA
   Ajuste simples para separar visualmente as duas linhas.
   ========================================================= */

@media (max-width: 767px) {

    #header .header-nav {
        margin-bottom: 14px !important;
    }

    #header .header-top {
        margin-top: 0 !important;
    }
}

/* =========================================================
   DESKTOP - LOGO CENTRADO SEM ALTERAR A ALTURA DO HEADER
   Centra apenas visualmente o logo dentro da row existente.
   Não altera display, grid, min-height, padding ou margens
   do header desktop.
   ========================================================= */

@media (min-width: 768px) {

    #header .header-top .row {
        position: relative !important;
    }

    #header #_desktop_logo {
        position: absolute !important;

        top: 50% !important;
        left: 50% !important;
        right: auto !important;

        width: auto !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        transform: translate(-50%, -50%) !important;

        z-index: 10 !important;
        overflow: visible !important;
    }

    #header #_desktop_logo h1 {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
    }

    #header #_desktop_logo a {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #header #_desktop_logo img,
    #header #_desktop_logo .logo {
        display: block !important;

        width: 300px !important;
        max-width: none !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }
}

/* =========================================================
   FOOTER - REDES SOCIAIS
   Cor base azul Printametro | Hover magenta Printametro
   ========================================================= */

#footer .block-social ul li,
#footer .social-sharing ul li,
#footer .social-follow ul li {
    background-color: var(--pm-blue) !important;
}

#footer .block-social ul li:hover,
#footer .social-sharing ul li:hover,
#footer .social-follow ul li:hover {
    background-color: var(--pm-cyan) !important;
}

/* Mantém os ícones visíveis */
#footer .block-social ul li a,
#footer .social-sharing ul li a,
#footer .social-follow ul li a {
    color: #fff !important;
}

/* =========================================================
   HOMEPAGE - BAIXAR O SLIDER 10PX
   ========================================================= */

#index #carousel {
    margin-top: 10px !important;
}

/* =========================================================
   HOMEPAGE - ESPAÇO REAL ENTRE HEADER E SLIDER
   O margin-top no carousel é neutralizado pela estrutura
   full-width; criamos o espaço no wrapper da homepage.
   ========================================================= */

#index #wrapper {
    padding-top: 10px !important;
}

#index #carousel {
    margin-top: 0 !important;
}

/* =========================================================
   HOMEPAGE - DESCER VISUALMENTE O SLIDER 10PX
   Usa posicionamento relativo para garantir o deslocamento.
   ========================================================= */

#index #carousel {
    position: relative !important;
    top: 10px !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}

#index #wrapper {
    padding-top: 0 !important;
}

/* =========================================================
   DESKTOP - BARRA SUPERIOR DO HEADER
   Fundo azul Printametro, texto branco, hover magenta.
   Mantém a estrutura atual do PrestaShop.
   ========================================================= */

@media (min-width: 768px) {

    #header .header-nav {
        background: var(--pm-blue) !important;
        border: 0 !important;
        box-shadow: none !important;

        min-height: 34px !important;
        height: 34px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header .header-nav .container {
        height: 34px !important;
    }

    #header .header-nav .row {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;
        min-height: 34px !important;

        margin-left: -15px !important;
        margin-right: -15px !important;
    }

    #header .header-nav .hidden-sm-down {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;
        height: 34px !important;
    }

    /* Zona esquerda */
    #header .header-nav .col-md-5 {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #header #_desktop_contact_link,
    #header #contact-link {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header #contact-link a {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;

        color: #fff !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1 !important;

        text-decoration: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header #contact-link a:hover {
        color: var(--pm-cyan) !important;
    }

    /* Zona direita */
    #header .header-nav .right-nav {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        height: 34px !important;

        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #header #_desktop_user_info,
    #header #_desktop_cart,
    #header .user-info,
    #header .blockcart {
        height: 34px !important;
        margin: 0 !important;
    }

    #header .user-info {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
    }

    #header .user-info a,
    #header .blockcart .header,
    #header .blockcart .header a,
    #header .blockcart span,
    #header .blockcart i {
        color: #fff !important;
    }

    #header .user-info a {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;

        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1 !important;

        text-decoration: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #header .user-info a:hover,
    #header .blockcart:hover .header,
    #header .blockcart:hover .header span,
    #header .blockcart:hover .header i {
        color: var(--pm-cyan) !important;
    }

    #header .blockcart,
    #header .blockcart .header {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #header .blockcart .header {
        display: flex !important;
        align-items: center !important;

        height: 34px !important;

        margin: 0 !important;
        padding: 0 10px !important;
    }

    #header .blockcart .material-icons,
    #header .user-info .material-icons {
        font-size: 18px !important;
        line-height: 1 !important;
    }
}

/* =========================================================
   DESKTOP - BARRA SUPERIOR REFINADA
   Texto maior + carrinho alinhado corretamente
   ========================================================= */

@media (min-width: 768px) {

    #header .header-nav,
    #header .header-nav .container,
    #header .header-nav .row,
    #header .header-nav .hidden-sm-down,
    #header .header-nav .col-md-5,
    #header .header-nav .right-nav,
    #header #_desktop_contact_link,
    #header #contact-link,
    #header #_desktop_user_info,
    #header #_desktop_cart,
    #header .user-info,
    #header .blockcart,
    #header .blockcart .header {
        min-height: 38px !important;
        height: 38px !important;
    }

    /* Tipografia da barra superior */
    #header #contact-link a,
    #header .user-info a,
    #header .user-info span,
    #header .blockcart .header,
    #header .blockcart .header span {
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 38px !important;
        white-space: nowrap !important;
    }

    /* Zona direita mais limpa */
    #header .header-nav .right-nav {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 18px !important;
        overflow: visible !important;
    }

    #header #_desktop_user_info,
    #header #_desktop_cart {
        display: flex !important;
        align-items: center !important;
        flex: 0 0 auto !important;
        width: auto !important;
        overflow: visible !important;
    }

    #header .user-info {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
        overflow: visible !important;
    }

    #header .user-info a {
        display: inline-flex !important;
        align-items: center !important;
        height: 38px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Carrinho: ícone + texto + quantidade na mesma linha */
    #header .blockcart,
    #header .blockcart .header {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        overflow: visible !important;
    }

    #header .blockcart .header {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;

        padding: 0 10px !important;
        margin: 0 !important;

        background: transparent !important;
        white-space: nowrap !important;
    }

    #header .blockcart .header .shopping-cart,
    #header .blockcart .header .material-icons {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        height: 38px !important;

        margin: 0 !important;
        padding: 0 !important;

        font-size: 20px !important;
        line-height: 38px !important;
        flex: 0 0 auto !important;
    }

    #header .blockcart .header span {
        display: inline-block !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 38px !important;
        white-space: nowrap !important;
    }

    /* Mantém as cores definidas */
    #header #contact-link a,
    #header .user-info a,
    #header .user-info span,
    #header .blockcart .header,
    #header .blockcart .header span,
    #header .blockcart .header i {
        color: #fff !important;
    }

    #header #contact-link a:hover,
    #header .user-info a:hover,
    #header .blockcart:hover .header,
    #header .blockcart:hover .header span,
    #header .blockcart:hover .header i {
        color: var(--pm-cyan) !important;
    }
}

/* =========================================================
   DESKTOP - ALINHAMENTO VERTICAL DO CARRINHO
   Corrige apenas o bloco do carrinho na barra superior.
   ========================================================= */

@media (min-width: 768px) {

    #header #_desktop_cart {
        display: flex !important;
        align-items: center !important;
        height: 38px !important;
    }

    #header #_desktop_cart .blockcart {
        display: flex !important;
        align-items: center !important;

        height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #header #_desktop_cart .blockcart .header {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;

        height: 38px !important;
        min-height: 38px !important;

        margin: 0 !important;
        padding: 0 10px !important;

        line-height: 1 !important;
    }

    #header #_desktop_cart .blockcart .header i,
    #header #_desktop_cart .blockcart .header .shopping-cart,
    #header #_desktop_cart .blockcart .header span {
        display: inline-flex !important;
        align-items: center !important;

        height: 38px !important;

        margin: 0 !important;
        padding: 0 !important;

        line-height: 1 !important;
        vertical-align: middle !important;
    }

    #header #_desktop_cart .blockcart .header i,
    #header #_desktop_cart .blockcart .header .shopping-cart {
        justify-content: center !important;
        font-size: 20px !important;
        transform: none !important;
    }

    #header #_desktop_cart .blockcart .header span {
        font-size: 14px !important;
        font-weight: 500 !important;
        white-space: nowrap !important;
    }
}

/* =========================================================
   SLIDER PRINTAMETRO - DESKTOP / MOBILE POR PARES
   Desktop: slides 1, 3, 5...
   Mobile:  slides 2, 4, 6...
   ========================================================= */

.printametro-slider-desktop {
    display: block !important;
}

.printametro-slider-mobile {
    display: none !important;
}

@media (max-width: 767px) {

    .printametro-slider-desktop {
        display: none !important;
    }

    .printametro-slider-mobile {
        display: block !important;
    }

    #index #carousel-mobile {
        position: relative !important;
        left: 50% !important;

        width: 100vw !important;
        max-width: 100vw !important;
        height: auto !important;

        margin-left: -50vw !important;
        margin-right: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 10px !important;

        overflow: hidden !important;
    }

    #index #carousel-mobile .carousel-inner,
    #index #carousel-mobile .carousel-item,
    #index #carousel-mobile .carousel-item figure {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    #index #carousel-mobile .carousel-item img {
        display: block !important;

        width: 100% !important;
        max-width: none !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: contain !important;
    }
}

/* =========================================================
   FIX DEFINITIVO - MOSTRAR APENAS O SLIDER CERTO
   Desktop: #carousel
   Mobile:  #carousel-mobile
   ========================================================= */

/* DESKTOP / TABLET */
#index #carousel {
    display: block !important;
}

#index #carousel-mobile {
    display: none !important;
}

/* MOBILE */
@media (max-width: 767px) {

    #index #carousel {
        display: none !important;
    }

    #index #carousel-mobile {
        display: block !important;
    }
}

/* =========================================================
   CHECKOUT - HEADER ESPECÍFICO
   Evita que as regras do header normal deformem o checkout.
   Mantém o logo centrado, mas com altura própria e sem
   sobrepor a barra superior.
   ========================================================= */

@media (min-width: 768px) {

    body#checkout #header .header-nav {
        position: relative !important;
        min-height: 86px !important;
        height: 86px !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        border: 0 !important;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
    }

    body#checkout #header .header-nav .container {
        position: relative !important;
        width: 100% !important;
        max-width: var(--pm-container) !important;
        height: 86px !important;
        margin: 0 auto !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    body#checkout #header .header-nav .row {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        min-height: 86px !important;
        height: 86px !important;
        margin-left: -15px !important;
        margin-right: -15px !important;
    }

    body#checkout #header .header-nav .hidden-sm-down {
        height: 86px !important;
    }

    /* Logo centrado no checkout */
    body#checkout #header #_desktop_logo {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: translate(-50%, -50%) !important;
        z-index: 5 !important;
        overflow: visible !important;
    }

    body#checkout #header #_desktop_logo a {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body#checkout #header #_desktop_logo img,
    body#checkout #header #_desktop_logo .logo {
        display: block !important;
        width: 260px !important;
        max-width: 260px !important;
        height: auto !important;
        max-height: 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
    }

    /* Contacto no lado esquerdo */
    body#checkout #header .header-nav .col-md-6.text-xs-right {
        position: absolute !important;
        top: 50% !important;
        left: 15px !important;
        right: auto !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: translateY(-50%) !important;
        text-align: left !important;
        z-index: 6 !important;
    }

    body#checkout #header #_desktop_contact_link,
    body#checkout #header #contact-link {
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body#checkout #header #contact-link a {
        display: inline-block !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        color: var(--pm-blue) !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
    }

    body#checkout #header #contact-link a:hover {
        color: var(--pm-cyan) !important;
    }
}


/* =========================================================
   CHECKOUT - MOBILE
   Mantém o header compacto e evita que regras desktop
   interfiram com o logo mobile.
   ========================================================= */

@media (max-width: 767px) {

    body#checkout #header .header-nav {
        background: #fff !important;
        border: 0 !important;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
    }

    body#checkout #header .header-nav .mobile {
        position: relative !important;
        min-height: 58px !important;
        height: 58px !important;
    }

    body#checkout #header #_mobile_logo img,
    body#checkout #header .top-logo img {
        width: auto !important;
        max-width: 145px !important;
        max-height: 36px !important;
        height: auto !important;
        object-fit: contain !important;
    }
}