/* Ajustes globais para Safari/iPhone e telas touch. */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@600;700;800;900&family=Nunito+Sans:wght@400;600;700&display=swap');

:root {
    --bp-safe-top: env(safe-area-inset-top, 0px);
    --bp-safe-right: env(safe-area-inset-right, 0px);
    --bp-safe-bottom: env(safe-area-inset-bottom, 0px);
    --bp-safe-left: env(safe-area-inset-left, 0px);
    --bp-font-body: 'Nunito Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --bp-font-display: 'Nunito', system-ui, -apple-system, sans-serif;
}

html {
    min-height: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    min-width: 320px;
    min-height: 100svh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-family: var(--bp-font-body);
}

h1, h2, h3, h4, .display, .title-display {
    font-family: var(--bp-font-display);
    font-weight: 800;
    letter-spacing: -0.02em;
}

@supports (min-height: 100dvh) {
    body {
        min-height: 100dvh;
    }
}

a,
button,
input,
select,
textarea,
label,
[role="button"] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(255, 106, 0, .16);
}

input,
select,
textarea {
    max-width: 100%;
    font-size: 16px;
}

button,
.btn,
.catalog-checkout-submit,
.catalog-checkout-secondary,
.catalog-modal-submit,
.catalog-add-button,
.catalog-cart-checkout,
.catalog-cart-continue {
    min-height: 44px;
}

input[type="search"],
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
textarea {
    -webkit-appearance: none;
    appearance: none;
}

img,
video,
canvas,
svg {
    max-width: 100%;
}

.table-wrap,
.catalog-modal-panel,
.catalog-cart-panel,
.sidebar,
.content {
    -webkit-overflow-scrolling: touch;
}

/* Tabelas responsivas: scroll horizontal com sombra indicando overflow no mobile */
.table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    background:
        linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0)) 0 0/24px 100% no-repeat,
        linear-gradient(-90deg, rgba(255,255,255,1), rgba(255,255,255,0)) 100% 0/24px 100% no-repeat,
        linear-gradient(90deg, rgba(15,56,93,.12), rgba(15,56,93,0)) 0 0/8px 100% no-repeat,
        linear-gradient(-90deg, rgba(15,56,93,.12), rgba(15,56,93,0)) 100% 0/8px 100% no-repeat;
    background-attachment: local, local, scroll, scroll;
}
.table-wrap table { min-width: 100%; }

/* Inputs com font-size >= 16px no iOS para evitar zoom automatico */
@media (max-width: 600px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea {
        font-size: 16px;
    }
}

body.catalog-app {
    padding-top: var(--bp-safe-top);
}

body.catalog-app.catalog-lock-scroll {
    position: fixed;
    inset: 0;
    width: 100%;
    overflow: hidden;
}

body.catalog-app .catalog-shell {
    padding-left: max(16px, var(--bp-safe-left));
    padding-right: max(16px, var(--bp-safe-right));
    padding-bottom: calc(118px + var(--bp-safe-bottom));
}

body.catalog-app .catalog-bottom-nav {
    width: min(100%, 760px);
    padding-left: var(--bp-safe-left);
    padding-right: var(--bp-safe-right);
}

body.catalog-app .catalog-bottom-nav-inner {
    padding-bottom: calc(8px + var(--bp-safe-bottom));
}

body.catalog-app .catalog-modal-panel,
body.catalog-app .catalog-cart-panel {
    height: 100svh;
    max-height: 100svh;
}

@supports (height: 100dvh) {
    body.catalog-app .catalog-modal-panel,
    body.catalog-app .catalog-cart-panel {
        height: 100dvh;
        max-height: 100dvh;
    }
}

body.catalog-app .catalog-modal-inner,
body.catalog-app .catalog-cart-inner {
    padding-bottom: calc(24px + var(--bp-safe-bottom));
}

body.catalog-app .catalog-modal-footer {
    padding-bottom: calc(14px + var(--bp-safe-bottom));
}

body.catalog-app .catalog-stage-back,
body.catalog-app .catalog-close,
body.catalog-app .catalog-option-quantity button {
    min-width: 44px;
    min-height: 44px;
}

.admin-shell {
    min-height: 100svh;
}

@supports (min-height: 100dvh) {
    .admin-shell {
        min-height: 100dvh;
    }
}

.sidebar {
    padding-top: max(24px, var(--bp-safe-top));
    padding-left: max(18px, var(--bp-safe-left));
}

.content {
    padding-right: max(28px, var(--bp-safe-right));
    padding-bottom: calc(28px + var(--bp-safe-bottom));
    padding-left: max(28px, var(--bp-safe-left));
}

.form-side {
    padding-right: max(48px, var(--bp-safe-right));
    padding-left: max(48px, var(--bp-safe-left));
}

@media (max-width: 780px) {
    .content,
    .shell {
        padding-right: max(16px, var(--bp-safe-right));
        padding-bottom: calc(18px + var(--bp-safe-bottom));
        padding-left: max(16px, var(--bp-safe-left));
    }

    .top-actions,
    .actions,
    .detail-actions,
    .catalog-checkout-actions {
        gap: 10px;
    }

    .table-wrap {
        margin-right: -4px;
        padding-bottom: 8px;
    }
}

@media (max-width: 900px) {
    .form-side {
        padding-right: max(24px, var(--bp-safe-right));
        padding-left: max(24px, var(--bp-safe-left));
    }
}

@media (max-width: 560px) {
    .form-side {
        min-height: 100svh;
        padding-top: calc(30px + var(--bp-safe-top));
        padding-right: max(22px, var(--bp-safe-right));
        padding-bottom: calc(30px + var(--bp-safe-bottom));
        padding-left: max(22px, var(--bp-safe-left));
    }
}