:root {
    --md-orange: #FF3D00;
    --md-yellow: #FFC703;
    --md-blue-dark: #001B5E;
    --md-blue: #0149FF;
    --md-white: #FFFFFF;
    --md-grey: #CDCFDE;
    --md-black: #171d1c;
    --md-green: #43b078;
    --md-green-dark: #307a56;
}

/* === AUTO B2B BUTTONS === */
    .ap-btn {
        font-family: 'Poppins', Arial, Helvetica, sans-serif;
        border: none;
        border-radius: 50em;
        padding: 0.6rem 1.4rem;
        box-sizing: border-box;
        text-align: center;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
    }
    /* Primární tlačítko (hlavní CTA) */
    .ap-btn-primary-dark {
        background-color: var(--md-blue-dark);
        color: var(--md-white);
        font-weight: 500;
        padding: 0.6rem 1.4rem;
        transition: all 0.2s ease;
    }
    .ap-btn-primary-dark:hover,
    .ap-btn-primary-dark:focus {
        background-color: var(--md-blue); /* sekundární modrá */
        color: var(--md-white);
    }
    .ap-btn-primary-dark:hover i,
    .ap-btn-primary-dark:focus i {
        color: var(--md-white);
    }
    
    .bouncy-font:hover {
        font-size: 1.0rem;
        animation: bounce 0.5s infinite alternate;
    }

    /* Primární tlačítko (druhotné CTA) */
    .ap-btn-primary-light {
        background-color: var(--md-blue);
        color: var(--md-white);
        font-weight: 500;
        padding: 0.6rem 1.4rem;
        transition: all 0.2s ease;
    }
    .ap-btn-primary-light:hover,
    .ap-btn-primary-light:focus {
        background-color: var(--md-blue-dark); /* sekundární modrá */
        color: var(--md-white);
    }
    .ap-btn-primary-light:hover i,
    .ap-btn-primary-light:focus i {
        color: var(--md-white);
    }

    /* Kulatá tlačítka s ikonami +/- */
    .ap-btn-primary-light-plus,
    .ap-btn-primary-light-minus {
        background-color: var(--md-blue);
        color: var(--md-white);
        font-weight: 500;
        width: 30px;
        height: 30px;
        padding: 0;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
        min-width: 30px;
        max-width: 30px;
        flex-shrink: 0;
        flex-grow: 0;
    }
    .ap-btn-primary-light-plus:hover,
    .ap-btn-primary-light-plus:focus,
    .ap-btn-primary-light-minus:hover,
    .ap-btn-primary-light-minus:focus {
        background-color: var(--md-blue-dark);
        color: var(--md-white);
    }
    .ap-btn-primary-light-plus:hover i,
    .ap-btn-primary-light-plus:focus i,
    .ap-btn-primary-light-minus:hover i,
    .ap-btn-primary-light-minus:focus i {
        color: var(--md-white);
    }
    .ap-btn-primary-light-plus i,
    .ap-btn-primary-light-minus i {
        font-size: 0.875rem;
        line-height: 1;
    }

    /* Sekundární tlačítko */
    .ap-btn-secondary {
        background-color: var(--md-grey);
        color: var(--md-blue-dark);
        font-weight: 500;
        padding: 0.6rem 1.4rem;
    }
    .ap-btn-secondary:hover,
    .ap-btn-secondary:focus {
        background-color: #b8bcc9;
        color: var(--md-blue-dark);
    }
    .ap-btn-secondary:hover i,
    .ap-btn-secondary:focus i {
        color: var(--md-blue-dark);
    }

    /* Akcentní (žluté) tlačítko */
    .ap-btn-accent {
        background-color: var(--md-yellow);
        color: var(--md-blue-dark);
        font-weight: 500;
        padding: 0.6rem 1.4rem;
    }
    .ap-btn-accent:hover,
    .ap-btn-accent:focus {
        background-color: #ffdb4d;
        color: var(--md-blue-dark);
    }
    .ap-btn-accent:hover i,
    .ap-btn-accent:focus i {
        color: var(--md-blue-dark);
    }

    /* Outline primární */
    .ap-btn-outline-primary {
        border: 1px solid var(--md-blue-dark);
        color: var(--md-blue-dark);
        background: transparent;
        font-weight: 500;
        padding: 0.6rem 1.4rem;
    }
    .ap-btn-outline-primary:hover,
    .ap-btn-outline-primary:focus, .ap-btn-outline-primary.active {
        background-color: var(--md-blue-dark);
        color: var(--md-white);
    }
    .ap-btn-outline-primary:hover i,
    .ap-btn-outline-primary:focus i, .ap-btn-outline-primary.active i {
        color: var(--md-white);
    }

    /* Nebezpečné (red) */
    .ap-btn-danger {
        background-color: var(--md-orange);
        border-color: var(--md-orange);
        color: var(--md-white);
        font-weight: 500;
        padding: 0.6rem 1.4rem;
        transition: all 0.2s ease;
    }
    .ap-btn-danger:hover,
    .ap-btn-danger:focus {
        background-color: #e63500;
        border-color: #e63500;
    }
    .ap-btn-danger:hover i,
    .ap-btn-danger:focus i {
        color: var(--md-white);
    }


    /* Pevné šířky tlačítek */
    .ap-btn-w0 {
        width: auto;
        height: 30px;
        font-size: 0.65rem;
    }

    .ap-btn-w1 {
        width: 100px;
        height: 30px;
        font-size: 0.65rem;
    }
    .ap-btn-w2 {
        width: 130px;
        height: 30px;
        font-size: 0.65rem;
    }
    .ap-btn-w3 {
        width: 160px;
        height: 30px;
        font-size: 0.65rem; 
    }
    .ap-btn-w4 {
        width: 180px;
        height: 30px;
    }
    .ap-btn-w5 {
        width: 200px;
        height: 30px;
    }
    .ap-btn-w6 {
        width: 250px;
        height: 30px;
    }

    .ap-btn-h30 {
        height: 30px;
    }

    /* Malá tlačítka s pevnou šířkou a výškou */
    .ap-btn-s1 {
        width: 180px;
        height: 25px;
        font-size: 0.75rem;
        padding: 0 0.5rem;
    }
    .ap-btn-s2 {
        width: 150px;
        height: 25px;
        font-size: 0.65rem;
        padding: 0 0.3rem;
    }
    .ap-btn-s3 {
        width: 110px;
        height: 25px;
        font-size: 0.65rem;
        padding: 0 0.15rem;
    }

    /* Malá tlačítka */
    .ap-btn-sm {
        padding: 0.25rem 0.5rem;
        font-size: 0.75rem;
        min-width: auto;
    }

            /* Efekt: Shadow Grow */
    .shadow-grow:hover {
        box-shadow: 0 8px 24px rgba(0,0,0,0.18), 0 1.5px 4px rgba(0,0,0,0.12);
        transform: translateY(-2px) scale(1.04);
        transition: box-shadow 0.2s, transform 0.2s;
    }

    /* Efekt: Pulse */
    .pulse:hover {
        animation: pulse 0.5s;
    }
    @keyframes pulse {
        0% { transform: scale(1);}
        50% { transform: scale(1.08);}
        100% { transform: scale(1);}
    }


    /* Efekt: Color Flash */
    .color-flash:hover {
        background-color: #FFC703 !important;
        color: #001B5E !important;
        transition: background 0.2s, color 0.2s;
    }

/* === RESPONSIVE: Zmenšení tlačítek o 20% pro obrazovky pod 1450px === */
@media (max-width: 1450px) {
    /* Základní padding pro všechna tlačítka */
    .ap-btn {
        padding: 0.48rem 1.12rem; /* 20% zmenšení z 0.6rem 1.4rem */
    }

    /* Primární tlačítka - padding */
    .ap-btn-primary-dark,
    .ap-btn-primary-light {
        padding: 0.48rem 1.12rem; /* 20% zmenšení */
    }

    /* Kulatá tlačítka s ikonami +/- */
    .ap-btn-primary-light-plus,
    .ap-btn-primary-light-minus {
        width: 24px; /* 20% zmenšení z 30px */
        height: 24px;
        min-width: 24px;
        max-width: 24px;
        flex-shrink: 0;
        flex-grow: 0;
    }
    .ap-btn-primary-light-plus i,
    .ap-btn-primary-light-minus i {
        font-size: 0.7rem; /* 20% zmenšení z 0.875rem */
    }

    /* Sekundární a akcentní tlačítka - padding */
    .ap-btn-secondary,
    .ap-btn-accent,
    .ap-btn-outline-primary,
    .ap-btn-danger {
        padding: 0.48rem 1.12rem; /* 20% zmenšení */
    }

    /* Pevné šířky tlačítek */
    .ap-btn-w0 {
        height: 24px; /* 20% zmenšení z 30px */
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w1 {
        width: 80px; /* 20% zmenšení z 100px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w2 {
        width: 104px; /* 20% zmenšení z 130px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w3 {
        width: 128px; /* 20% zmenšení z 160px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w4 {
        width: 144px; /* 20% zmenšení z 180px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w5 {
        width: 160px; /* 20% zmenšení z 200px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-w6 {
        width: 200px; /* 20% zmenšení z 250px */
        height: 24px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
    }

    .ap-btn-h30 {
        height: 24px; /* 20% zmenšení z 30px */
    }

    /* Malá tlačítka s pevnou šířkou a výškou */
    .ap-btn-s1 {
        width: 144px; /* 20% zmenšení z 180px */
        height: 20px; /* 20% zmenšení z 25px */
        font-size: 0.66rem; /* 20% zmenšení z 0.75rem + 10% zvětšení (0.6 * 1.1) */
        padding: 0 0.4rem; /* 20% zmenšení z 0.5rem */
    }

    .ap-btn-s2 {
        width: 120px; /* 20% zmenšení z 150px */
        height: 20px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
        padding: 0 0.24rem; /* 20% zmenšení z 0.3rem */
    }

    .ap-btn-s3 {
        width: 88px; /* 20% zmenšení z 110px */
        height: 20px;
        font-size: 0.572rem; /* 20% zmenšení z 0.65rem + 10% zvětšení (0.52 * 1.1) */
        padding: 0 0.12rem; /* 20% zmenšení z 0.15rem */
    }

    /* Malá tlačítka */
    .ap-btn-sm {
        padding: 0.2rem 0.4rem; /* 20% zmenšení z 0.25rem 0.5rem */
        font-size: 0.66rem; /* 20% zmenšení z 0.75rem + 10% zvětšení (0.6 * 1.1) */
    }
}