/**
 * MOBILE FIX - KRITISK
 * Løser alle mobilproblemer
 */

/* ================================================
   MOBIL OG TABLET (< 900px)
   ================================================ */
@media screen and (max-width: 900px) {

    /* FORCE PREVENT HORIZONTAL SCROLL */
    html, body {
        max-width: 100vw !important;
        overflow-x: clip !important;
    }

    /* ---- FULL-WIDTH CARDS ON MOBILE ---- */

    /* Full-bleed: break out of any parent padding/max-width */
    .utleiekalk-finn-wrapper,
    .yield-calculator-wrapper {
        width: 100vw !important;
        max-width: none !important;
        position: relative !important;
        left: 50% !important;
        margin-left: -50vw !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Cards edge-to-edge — must match elementor-compat specificity */
    .utleiekalk-finn-wrapper .uk-card,
    .yield-calculator-wrapper .uk-card {
        border-radius: 0 !important;
        padding: 20px 16px !important;
        border-left: none !important;
        border-right: none !important;
        margin-bottom: 0 !important;
    }

    /* Tighter gap between sections */
    .utleiekalk-finn-form,
    .flipping-form,
    .yield-form {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    /* Flipping collapsed sections: match rental calculator height */
    .flipping-form .uk-section.collapsed .uk-step {
        padding: 0 !important;
        margin-bottom: 16px !important;
    }

    .flipping-form .uk-section.collapsed .uk-step-title {
        margin-bottom: 0 !important;
    }

    .flipping-form .uk-section.collapsed {
        cursor: pointer !important;
    }

    /* Kalkulatorwrapper må ikke gå utenfor skjermen */
    /* Note: .utleiekalk-finn-wrapper and .yield-calculator-wrapper excluded — use full-bleed (width: 100vw) above */
    .utleiekalk-shell,
    .utleiekalk-finn-form,
    .uk-card,
    .uk-section,
    .uk-grid,
    .uk-actions {
        max-width: 100% !important;
        width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* Alle input-felter og knapper må passe på skjermen */
    .uk-input,
    input,
    select,
    textarea,
    button {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Grid må være 1 kolonne */
    .uk-grid {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
    }

    /* KRITISK: SKJUL ALLE SEKUNDÆRE KNAPPER */
    /* Bruker alle mulige selektorer for å være 100% sikker */
    button[id="notater_btn"],
    button.notater-btn,
    .notater-btn,
    #notater_btn,

    button.utleiekalk-clear-all,
    .utleiekalk-clear-all,

    button.utleiekalk-pdf-btn,
    .utleiekalk-pdf-btn,

    button[id="feedback-btn"],
    button.utleiekalk-feedback-btn,
    .utleiekalk-feedback-btn,
    #feedback-btn,

    .uk-actions button.uk-info,
    .uk-actions button.uk-danger,
    .uk-actions button.uk-accent,
    .uk-actions .uk-btn.uk-info,
    .uk-actions .uk-btn.uk-danger,
    .uk-actions .uk-btn.uk-accent {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -99999px !important;
        width: 0 !important;
        height: 0 !important;
        pointer-events: none !important;
    }

    /* VIS HAMBURGER-MENY - full bredde på mobil */
    .hamburger-menu-btn,
    #hamburger_menu_btn,
    #flipping_hamburger_btn,
    button.hamburger-menu-btn,
    .uk-actions .hamburger-menu-btn,
    .uk-actions #hamburger_menu_btn,
    .uk-actions #flipping_hamburger_btn,
    .uk-actions button.hamburger-menu-btn {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        pointer-events: auto !important;
        justify-content: center !important;
        align-items: center !important;
        flex: 1 1 100% !important;
        flex-basis: 100% !important;
        flex-grow: 1 !important;
        flex-shrink: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Hamburger-meny dropdown styling */
    .hamburger-menu,
    #hamburger_menu,
    #flipping_hamburger_menu {
        display: none;
        width: 100%;
        max-width: 100%;
        position: relative;
        z-index: 9999;
    }

    .hamburger-menu.active,
    #hamburger_menu.active,
    #flipping_hamburger_menu.active {
        display: flex !important;
        flex-direction: column;
        gap: 8px;
        background: white;
        border: 1px solid #ddd;
        border-radius: 12px;
        padding: 8px;
        margin-top: 8px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

    .hamburger-menu-item {
        width: 100% !important;
        max-width: 100% !important;
        text-align: left;
    }

    /* Actions bar må wrappe pent */
    .uk-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 12px !important;
    }

    /* Primære knapper (Lagre, Ny, Hent fra FINN) - 1 per rad på mobil */
    .uk-actions .uk-primary,
    .uk-actions .uk-ghost:not(.hamburger-menu-btn),
    .uk-actions .uk-secondary {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 100% !important;
        font-size: 14px !important;
        padding: 12px 16px !important;
        white-space: nowrap;
        justify-content: center;
    }

    /* Lagrede kalkulasjoner full bredde */
    .uk-actions .uk-right {
        width: 100% !important;
        order: 100;
        margin-top: 8px;
    }

    .cases-toggle {
        width: 100% !important;
    }

    /* Større touch targets */
    .uk-btn {
        min-height: 44px !important;
        font-size: 14px !important;
    }

    .uk-input {
        min-height: 44px !important;
        font-size: 16px !important;
    }

    /* PREVENT AUTO-ZOOM ON INPUT FOCUS - ALL SECTIONS */
    /* iOS og Android zoomer inn på input-felt med font-size < 16px */
    #sec-grunnlag .uk-input,
    #sec-grunnlag input[type="text"],
    #sec-grunnlag input[type="number"],
    #sec-grunnlag input[type="url"],
    #sec-grunnlag select,
    #sec-grunnlag textarea,
    #sec-laan .uk-input,
    #sec-laan input[type="text"],
    #sec-laan input[type="number"],
    #sec-laan input[type="url"],
    #sec-laan select,
    #sec-laan textarea,
    #sec-utgifter .uk-input,
    #sec-utgifter input[type="text"],
    #sec-utgifter input[type="number"],
    #sec-utgifter input[type="url"],
    #sec-utgifter select,
    #sec-utgifter textarea,
    #sec-inntekt .uk-input,
    #sec-inntekt input[type="text"],
    #sec-inntekt input[type="number"],
    #sec-inntekt input[type="url"],
    #sec-inntekt select,
    #sec-inntekt textarea,
    #sec-oppussing .uk-input,
    #sec-oppussing input[type="text"],
    #sec-oppussing input[type="number"],
    #sec-oppussing input[type="url"],
    #sec-oppussing select,
    #sec-oppussing textarea,
    #sec-skatt .uk-input,
    #sec-skatt input[type="text"],
    #sec-skatt input[type="number"],
    #sec-skatt input[type="url"],
    #sec-skatt select,
    #sec-skatt textarea,
    #sec-simulering .uk-input,
    #sec-simulering input[type="text"],
    #sec-simulering input[type="number"],
    #sec-simulering input[type="url"],
    #sec-simulering select,
    #sec-simulering textarea {
        font-size: 16px !important;
    }

    /* Skjul sticky widget */
    .sticky-widget {
        display: none !important;
    }

    /* Fix segmented control (rental mode slider) - bedre alignment */
    .seg-wrap {
        padding: 0 !important;
        gap: 0 !important;
    }

    .seg-btn {
        padding: 10px 4px !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
        overflow: visible !important;
        white-space: normal !important;
        word-break: break-word !important;
        hyphens: auto !important;
    }

    .seg-indicator {
        left: 0 !important;
        box-sizing: border-box !important;
    }

    /* Mindre tekst for siste knapp som er lang */
    .seg-btn[data-mode="hybrid"] {
        font-size: 9px !important;
        padding: 10px 2px !important;
    }

    /* Fix charts - bedre responsivitet på mobil */
    .sim-chart-container {
        padding: 16px 12px !important;
    }

    .sim-chart-container canvas {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* MOBILE-OPTIMALISERT TABELL - KORT LAYOUT */
    .sim-table-wrapper {
        overflow-x: visible !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        padding: 0 !important;
    }

    .sim-table {
        display: block !important;
        border: none !important;
    }

    .sim-table thead {
        display: none !important;
    }

    .sim-table tbody {
        display: block !important;
    }

    .sim-table tr {
        display: block !important;
        margin-bottom: 16px !important;
        background: white !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 12px !important;
        padding: 14px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    }

    .sim-table tr:hover {
        background: white !important;
    }

    .sim-table td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 8px 0 !important;
        border: none !important;
        border-bottom: 1px solid #f3f4f6 !important;
    }

    .sim-table td:last-child {
        border-bottom: none !important;
    }

    /* Legg til labels før hver verdi */
    .sim-table td::before {
        content: attr(data-label) !important;
        font-weight: 700 !important;
        font-size: 12px !important;
        color: #6b7280 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    /* Spesialstyling for første celle (år) */
    .sim-table .year-cell {
        font-size: 16px !important;
        font-weight: 800 !important;
        color: var(--uk-primary) !important;
        padding: 0 0 12px 0 !important;
        border-bottom: 2px solid #e5e7eb !important;
        margin-bottom: 8px !important;
    }

    .sim-table .year-cell::before {
        content: '' !important;
    }

    /* Input felter i tabellen */
    .sim-table .sim-rate-input {
        width: 80px !important;
        font-size: 14px !important;
    }

    /* Juster editable cells */
    .sim-table .editable-cell {
        padding: 8px 0 !important;
    }

    /* LAGREDE KALKULASJONER - KORT LAYOUT PÅ MOBIL */
    .cases-list {
        margin-top: 16px !important;
        gap: 12px !important;
        /* IKKE sett display her - la default display: none gjelde */
    }

    .cases-list.visible {
        display: flex !important;
        flex-direction: column !important;
    }

    .case-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 14px !important;
        background: white !important;
        border: 1px solid #e5e7eb !important;
        border-radius: 12px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    }

    .case-item:last-child {
        border-bottom: 1px solid #e5e7eb !important;
    }

    .case-meta {
        font-size: 13px !important;
        color: #6b7280 !important;
        padding-bottom: 8px !important;
        border-bottom: 1px solid #f3f4f6 !important;
    }

    .case-buttons {
        display: flex !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .case-buttons button {
        flex: 1 !important;
        padding: 10px 12px !important;
        font-size: 13px !important;
        border-radius: 8px !important;
        min-height: 44px !important;
    }
}

/* ================================================
   DESKTOP (> 900px)
   ================================================ */
@media screen and (min-width: 901px) {
    /* SKJUL hamburger-meny på desktop */
    .hamburger-menu-btn,
    #hamburger_menu_btn,
    #flipping_hamburger_btn,
    .hamburger-menu,
    #hamburger_menu,
    #flipping_hamburger_menu {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        position: absolute !important;
        left: -99999px !important;
    }
}