:root {
    --wp-admin--admin-bar--height: 0;
}

html {
    margin: 0 !important;
    margin-top: 0 !important;
    
}

.doprava-body {
    overflow: hidden;
}

#doprava-wrapper {
    width:  100dvw;
    height: 100dvh;
}

#doprava-wrapper p {
    margin: 0;
    padding: 0;
}

.doprava-loading {
    width: 100%;
    height: 100%;

    background-color: #00005D;
    
    display: flex;
    justify-content: center;
    align-items: center;
}

.doprava-loading img {
    filter: invert(1);
    height: 64px;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

.doprava-pre-loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100dvw;
    height: 100dvh;

    z-index: 10;
    background-color: rgba(1, 1, 1, 0.5);

    display: flex;
    justify-content: center;
    align-items: center;
}

.doprava-pre-loading img {
    filter: invert(10%) sepia(79%) saturate(3156%) hue-rotate(236deg) brightness(84%) contrast(132%);
    height: 64px;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

.doprava-error-message {
    top: 92px;
    left: 50%;
    z-index: 11;

    transform: translateX(-50%);
    position: fixed;

    width: calc(100dvw - 40px);
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;

    box-sizing: border-box;

    color: #FFFFFF;
    background-color: #ED5E68;
    padding-top: 20px;
    padding-bottom: 20px;
    border-radius: 12px;

    filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5));
}

/*
: TOP BAR
*/
.doprava-top-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 72px;
    background-color: #00005D;

    padding-left: 20px;
    padding-right: 20px;
    z-index: 3;
}

.doprava-top-bar-sides {
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

.doprava-top-bar-sides span {
    display: block;
    font-size: 14px;
    color: #F7F7F7;

    line-height: 1;
}

.doprava-top-bar-sides h1 {
    font-size: 20px;
    color: #F7F7F7;
    font-weight: 600;
    line-height: 1;
}

.doprava-top-rectangle {
    position: fixed;
    top: 71px;
    z-index: 5;
    right: 0;
}

.doprava-top-rectangle img {
    width: 40px;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

/*
: BOTTOM BAR
*/
.doprava-bottom-bar {
    width: 100%;
    height: 90px;

    position: fixed;
    bottom: 0;
    left: 0;
    color: #FFFFFF;
    box-sizing: border-box;
    border-bottom: 8px solid #00005D;
    padding: 20px;

    background-color: #FFFFFF;
    box-shadow: inset 0px 4px 4px rgba(0, 0, 0, 0.3);
    z-index: 3;
}

/* ➡️ BALENIE KOD */
.doprava-bottom-bar-qr {
    height: 180px;
}
/* ⬅️ BALENIE KOD */

.doprava-bottom-bar-row {
    display: flex;
    justify-content: space-between;
    gap: 0 10px;
    margin-bottom: 20px;
}

/* QR final – lepšia čitateľnosť dlhých názvov a stavovej hlášky */
.doprava-bottom-bar-cpt-info {
    align-items: flex-start;
}
.doprava-bottom-bar-cpt-info p {
    font-size: 14px;
    line-height: 1.2;
    white-space: normal;
    word-break: break-word;
    overflow: visible;
    text-overflow: clip; /* žiadne trojbodky */
}
.doprava-bottom-bar-cpt-info > div:first-child {
    max-width: 55%;
    max-height: 48px; /* obmedz text, nech nepohltí tlačidlá */
    overflow-y: auto; /* ak je veľmi dlhý, dá sa posunúť v rámci panelu */
}
.doprava-bottom-bar-cpt-info .package-count {
    font-size: 11px;
    line-height: 1.2;
    max-width: 50%;
    text-align: right;
}

.doprava-bottom-bar-row-center {
    justify-content: center;
}

/*
: CONTENT
*/
.doprava-content {
    width: 100%;
    margin-top: 72px;
    height: calc(100dvh - 72px - 90px);
    overflow-x: hidden;
    overflow-y: scroll;
}

.doprava-content-spacing {
    padding-left: 20px;
    padding-right: 20px;
}

.doprava-content-wrapper {
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    position: relative;
}

/* ➡️ BALENIE KOD */
.doprava-content-qr {
    height: calc(100dvh - 72px - 180px);
}
/* ⬅️ BALENIE KOD */

.doprava-content-rozvoz {
    padding-top: 20px;
}

.doprava-rozvoz-left {
    width: 100%;
}

.doprava-rozvoz-left h2,
.doprava-rozvoz-left h3 {
    color: #00005D;
}

.doprava-rozvoz-left h2 {
    font-size: 18px;
}

.doprava-rozvoz-left h3 {
    font-size: 14px;
}

.doprava-rozvoz-left p {
    color: #00005D;
}

.doprava-rozvoz-left span {
    color: #00005D;
    display: block;
    font-size: 14px;
}

.doprava-rozvoz-left span.this-day {
    color: #ED5E68;
}

.doprava-rozvoz-right {
    width: 70%;
    color: #00005D;
}

.doprava-rozvoz-right-history {
    margin-bottom: 10px;
}

.doprava-rozvoz-states {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
}

.doprava-rozvoz-states div {
    text-align: center;
    width: 100%;
    padding: 12px;
    background-color: #FFFFFF;
    border-radius: 4px;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}


/* ➡️ BALENIE KOD */
.doprava-qr-cancel-order-wrapper,
.doprava-dodaci-list-send-wrapper,
.doprava-orders-alert {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 12;

    width: 100dvw;
    height: 100dvh;
    display: none;
    background-color: rgba(0, 0, 0, 0.5);
}

.doprava-qr-cancel-order-w,
.doprava-dodaci-list-send-w,
.doprava-orders-alert-wrapper {
    width: 100dvw;
    height: 100dvh;
    display: flex;
    justify-content: center;
    align-items: center;

    padding-left: 20px;
    padding-right: 20px;
}

.doprava-qr-cancel-order-container,
.doprava-dodaci-list-send-container,
.doprava-orders-alert-container {
    width: 90%;
    padding: 20px;
    background-color: #FFFFFF;
    border-radius: 8px;
}

.doprava-qr-cancel-order-container p,
.doprava-dodaci-list-send-container p,
.doprava-orders-alert-container p {
    color: #00005D;
    font-size: 18px;
    margin-bottom: 20px !important;
}
/* ⬅️ BALENIE KOD */

.doprava-orders-alert-container p {
    font-size: 14px;
}

.doprava-qr-cancel-order-container div,
.doprava-dodaci-list-send-container div,
.doprava-orders-alert-container div {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 20px;
}

.doprava-dodaci-list-send-wrapper #doprava-dodaci-list-pozn-no {
    width: 100% !important;
}

.doprava-dodaci-list-send-wrapper textarea {
    resize: none;
    width: 100%;
    height: 200px;

    margin-bottom: 20px;
    box-sizing: border-box;
}

/*
: Orders table
*/
.doprava-orders-table {
    margin-top: 20px;
}

.doprava-orders-table-body {
    border-collapse: separate;
    border-spacing: 0 10px;
    border: 0;
}

.doprava-orders-table p {
    margin: 0;
}

.doprava-orders-table td,
.doprava-orders-table th {
    border: none;
}

.doprava-orders-table-body tbody tr {
    color: #00005D;
    background-color: #FFFFFF;
	border: 2px solid transparent;
    filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5));
}

.sorting-row {
    background-color: #aaaada;
}

.doprava-orders-table-body tbody tr td {
    user-select: none;
}

.doprava-orders-size-1 {
    width: 15%;
    font-size: 16px;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.doprava-orders-size-3,
.doprava-orders-size-4 {
    width: 15%;
}

.doprava-orders-size-3 img,
.doprava-orders-size-4 img {
    max-width: 20px;
    height: 20px;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

.doprava-orders-size-4 {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.doprava-orders-td-action {
    text-align: center;
}

.doprava-orders-td-position {
    padding-left: 20px;
}

.doprava-rozvoz-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0 40px;
}

.doprava-rozvoz-poznamka {
    padding-bottom: 40px !important;
}

/*
: Products table
*/
/*
: Orders table
*/
.doprava-products-table {
    margin-top: 20px;
}

.doprava-products-table-head {
    border-collapse: collapse;
    border: 0;
}

.doprava-products-table-body {
    border-collapse: separate;
    border-spacing: 0 10px;
    border: 0;
}

.doprava-products-table p {
    margin: 0;
}

.doprava-products-table td,
.doprava-products-table th {
    border: none;
}

.doprava-products-table-head tbody tr {
    color: #8080AE;
    border-bottom: 1px solid #00005D;
}

.doprava-products-table-head tbody tr {
    font-weight: 400;
}

.doprava-products-table-body tbody tr {
    color: #00005D;
    background-color: #FFFFFF;

    filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5));
}

.doprava-products-table-body tbody tr td {
    user-select: none;
}

.doprava-products-size-1 {
    width: 15%;
    font-size: 16px;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.doprava-products-size-2 {
    text-align: center;
}

.doprava-products-size-3 {
    width: 15%;
    text-align: center;
}

.doprava-products-size-4 {
    width: 25%;
    text-align: center;
}

.doprava-products-size-4 img {
    max-width: 20px;
    height: 20px;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

.doprava-products-size-4 {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.doprava-products-quantity-selector {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 10px;
}

.doprava-products-quantity-selector div {
    cursor: pointer;
}

.doprava-products-even-row {
    background-color: #ECECEC;
}

.doprava-products-even-row td {
    background-color: #ECECEC
}

.doprava-products-quantity-selector input[type=text] {
    width: 50px;
    height: 36px;
    text-align: center;
}

/*
*/
.doprava-bottom-bar-cpt-info {
    color: #00005D;
}

.doprava-bottom-bar-cpt-info div p {
    font-size: 18px;
    line-height: 24px;
}

.doprava-bottom-bar-cpt-info div > p:first-child {
    font-weight: 400;
}

.doprava-bottom-bar-cpt-info div > p:nth-child(2) {
    font-weight: 700;
}

/* ➡️ BALENIE KOD */
.doprava-bottom-bar-cpt-info .package-count {
    font-size: 16px;
    font-weight: 400;
}
/* ⬅️ BALENIE KOD */

.doprava-content-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    touch-action: none;
    user-select: none;
    overflow: hidden;
}

.canvas-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100dvw;
    height: calc(100dvh - 72px - 180px);

    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    touch-action: none;
    user-select: none;
}

.canvas-overlay img {
    width: 180px;
    height: 200px;;
    filter: invert(1);

    margin: 0;
    padding: 0;
    pointer-events: none;
    touch-action: none;
    user-select: none;
}

/*
: Photos
*/
.doprava-photos-wrapper {
    width: 100%;
    display: flex;
    /* [FOTO10_FIX] 10 okienok v JEDNOM riadku so scrollom doprava.
       Predtým flex-wrap:wrap lámalo 10 okienok do 3 riadkov a vytláčalo
       tlačidlá (odfotiť/ďalej) mimo obrazovku. */
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.doprava-photo-mini {
    box-sizing: border-box;
    width: 70px;
    height: 70px;
    flex: 0 0 auto; /* [FOTO10_FIX] okienka sa nescvrkávajú, držia 70px a scrollujú */
    border-radius: 4px;
    background-color: #FFFFFF;
    border: 2px solid #00005D;
    cursor: pointer;
}

.doprava-photo-mini img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;

    pointer-events: none;
    touch-action: none;
    user-select: none;
}

/*
: Dodaci list
*/
.doprava-dodaci-list,
.doprava-dodaci-list #pdf-canvas,
.doprava-dodaci-list iframe {
    width: 100%;
    height: 100%;
}

.doprava-dodaci-list #pdf-canvas {
    object-fit: contain;
}

.doprava-dodaci-list-send {
    position: fixed;
    top: 92px;
    right: 20px;

    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    
    width: 40px;
    height: 40px;

    z-index: 6;

    border-radius: 50%;
    background-color: #0478FF;
}

.doprava-dodaci-list-send img {
    display: block;
    width: 24px;
    height: 24px;
}

/*
: Signature
*/
.doprava-signature {
    width: 100%;
    height: 100%;

    position: relative;
}

.doprava-signature-clear {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 40px;

    position: absolute;
    bottom: 20px;
    left: 20px;

    z-index: 5;

    background-color: #ED5E68;
    border-radius: 12px;
    cursor: pointer;
}

.doprava-signature-clear img {
    width: 33px;
    height: 27px;
}

/*
: Login
*/
.doprava-login-wrapper {
    width: 100dvw;
    height: 100dvh;

    background-color: #00005D;
    display: flex;
    justify-content: center;
    align-items: center;
}

.doprava-login-container {
    padding: 20px;
}

.doprava-login-logo {
    display: flex;
    justify-content: center;
    align-items: center;

    margin-bottom: 20px;
}

.doprava-login-logo img {
    height: 40px;
}

.doprava-login-container form {
    width: 100%;
    max-width: 500px;
}

.doprava-login-container form label {
    display: block;
    width: 100%;
    margin-bottom: 5px;
    color: #F7F7F7;
}

.doprava-login-container form input {
    width: 100%;
    margin-bottom: 10px;
    border-radius: 8px;
    height: 49px;
}

.doprava-login-container button {
    width: 100%;
    border-radius: 8px;
    height: 49px;
}

.doprava-login-error {
    padding: 20px;
    background-color: #ED5E68;
    color: #F7F7F7;
    font-size: 14px;
    
    border-radius: 8px;
    margin-bottom: 10px;
    text-align: center;

    display: none;
}

/*
: Zoznam objednávok v aplikácii (kuriér a skladník)
*/
.details-content {
    width: 100dvw;
    position: absolute;
    left: 20px;
    bottom: 10px;
    font-size: 11px !important;
    z-index: 2;

    display: none;
    justify-content: left;
    align-items: flex-start;
    gap: 0 10px;
}

.details-content h2,
.details-content h3,
.details-content p,
.details-content span {
    color: #00005D !important;
    font-size: 11px !important;
}

.details-content h3 {
    margin-bottom: 10px;
}

.doprava-order-info-left span {
    font-weight: 700;
}

.doprava-order-opened {
    height: 250px;
}

.doprava-order-info-left {
    width: 50%;
}

.doprava-order-info-left button {
    padding: 8px 12px !important;
    margin-top: 10px !important;
    font-size: 13px;
    box-shadow: none!important;
    height: auto!important;
}

.doprava-order-info-left button:hover {
    padding: 8px 12px !important;
    margin-top: 10px !important;
    font-size: 13px;
    box-shadow: none!important;
    height: auto!important;
}

.doprava-order-info-split-info p {
    display: block;
}

.doprava-order-info-split-info span {
    display: block;
    width: 20px;
}

.order-days-p {
    display: flex !important;
    justify-content: left;
    align-items: center;
}

.doprava-order-details-opened {
    display: flex;
}

.doprava-orders-td-info p,
.doprava-orders-td-info span {
    user-select: none;
    pointer-events: none;
    touch-action: none;
}


/* ➡️ BALENIE KOD */
.doprava-products-qr {
    position: fixed;
    z-index: 150000;
    top: 0;
    left: 0;
    width: 100dvw;
    height: 100dvh;

    background-color: white;

    display: flex;
    justify-content: center;
    align-items: center;
}

.doprava-products-qr img {
    width: 240px;
    height: 240px;
}
/* ⬅️ BALENIE KOD */

/*
: Telefón — kuriérska aplikácia (pridané 8. 9. 2026)
:
: Aplikácia sa celý čas používa na telefóne, ale CSS nemalo ani jeden
: `@media` — layout bol postavený na šírku tabletu. Na 390 px sa detail
: zastávky lámal na jedno slovo na riadok a rozbalená karta v zozname
: (`.details-content`) je `position: absolute`, takže ležala na texte
: pod sebou (názov prevádzky sa prekrýval s firmou).
*/

/* Rozbalený detail v zozname patrí do toku, nie nad susedný text. */
.details-content {
    position: static;
    left: auto;
    bottom: auto;
    width: 100%;
    margin-top: 8px;
    flex-wrap: wrap;
    gap: 10px 16px;
    box-sizing: border-box;
}

.doprava-order-opened {
    height: auto;
}

@media (max-width: 820px) {
    /* Detail zastávky: história pod údajmi, nie vedľa nich v 30 % šírky. */
    .doprava-rozvoz-wrapper {
        flex-direction: column;
        gap: 16px 0;
    }

    .doprava-rozvoz-left,
    .doprava-rozvoz-right {
        width: 100%;
    }

    .doprava-rozvoz-left h2 { font-size: 20px; }
    .doprava-rozvoz-left p,
    .doprava-rozvoz-left span { font-size: 15px; line-height: 1.45; }

    /* História stavov v rade a vodorovne posuvná — na telefóne sa nezvislí. */
    .doprava-rozvoz-states {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0 6px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 6px;
    }

    .doprava-rozvoz-states > div {
        flex: 0 0 auto;
        background: #F1F4FA;
        border-radius: 8px;
        padding: 8px 10px;
    }

    .doprava-rozvoz-states > div p { font-size: 13px; white-space: nowrap; }

    .doprava-rozvoz-states > img {
        flex: 0 0 auto;
        transform: rotate(-90deg);
        width: 14px;
        height: 14px;
    }

    /* Zoznam objednávok: číslo úzko, názov a adresa dostanú miesto. */
    .doprava-orders-size-1 { width: 42px; padding-left: 10px; font-size: 15px; }
    .doprava-orders-size-3,
    .doprava-orders-size-4 { width: 34px; }
    .doprava-orders-td-info span { font-size: 15px; line-height: 1.3; display: block; }
    .doprava-orders-td-info p { font-size: 13px; line-height: 1.3; color: #4a4a6a; }
    .doprava-orders-table-body tbody tr td { padding-top: 10px; padding-bottom: 10px; }

    .details-content h2,
    .details-content h3,
    .details-content p,
    .details-content span { font-size: 13px !important; }

    .doprava-order-info-left,
    .doprava-order-info-right { width: 100%; }

    /* Dotykové cieľe: rad ikon dole mal 34 px, čo sa na telefóne míňa. */
    .doprava-bottom-bar-row { gap: 0 6px; }
    .doprava-bottom-bar-row .doprava-regular-button {
        min-height: 48px;
        min-width: 44px;
        padding: 6px 8px;
    }
    .doprava-bottom-bar-row .doprava-regular-button img { max-width: 22px; }

    .doprava-top-bar { padding-left: 12px; padding-right: 12px; }
    .doprava-top-bar-sides h1 { font-size: 17px; }
    .doprava-content-spacing { padding-left: 12px; padding-right: 12px; }
}

/* 0.8.2: okno vyzdvihnutia u dodávateľa (Prevziať bez QR) */
.doprava-vyzdvihnutie-container {
    box-sizing: border-box;
    max-width: 100%;
    max-height: 85dvh;
    overflow-y: auto;
}
.doprava-orders-alert-container p.doprava-vyzdvihnutie-nadpis {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px !important;
}
.doprava-vyzdvihnutie-tab {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0 0 20px;
    font-size: 15px;
    color: #00005D;
}
.doprava-vyzdvihnutie-tab th,
.doprava-vyzdvihnutie-tab td {
    padding: 6px 4px;
    border-bottom: 1px solid #E4E4F0;
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
}
.doprava-vyzdvihnutie-tab th {
    width: 32%;
    font-weight: 600;
    color: #5A5A80;
}