/* =============================== */
/* OPTIONS                         */
/* =============================== */

.ezb-td-options {
    margin-bottom: 70px;
}

.ezb-td-options-title {
    margin-bottom: 24px;
    font-size: 1.6rem;
    font-weight: 700;
}

/* CARD */
.ezb-option-card {
    padding: 24px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 16px;
}

/* HEADER */
.ezb-option-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

.ezb-option-title {
    margin-bottom: 4px;
    font-size: 1.2rem;
    font-weight: 700;
}

.ezb-option-subtitle {
    margin-top: 8px;
    font-size: 0.9rem;
    color: #666;
}

.ezb-option-price-wrap {
    text-align: right;
}

.ezb-option-price-label {
    font-size: 0.8rem;
    color: #666;
}

.ezb-option-price {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--ez-primary);
}

/* META */
.ezb-option-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 22px;
    margin: 16px 0 24px;
}

.ezb-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    color: #444;
}

/* BADGE */
.ezb-option-badge {
    padding: 5px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 999px;
}

.ezb-badge-available {
    color: #0a8f3a;
    background: #e8f7ee;
}

/* MAIN GRID */
.ezb-option-layout {
    display: grid;
    grid-template-columns: 1fr 260px;
    align-items: start;
    gap: 16px;
    margin-top: 16px;
}

/* LEFT DETAILS */
.ezb-option-section {
    margin-bottom: 20px;
}

.ezb-option-section-title {
    margin-bottom: 12px;
    font-weight: 700;
}

.ezb-option-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ezb-option-list li {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

/* RIGHT BOOKING */
.ezb-option-booking {
    padding-left: 24px;
    border-left: 1px solid #eee;
}

.ezb-option-label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.85rem;
    font-weight: 600;
}

.ezb-option-select {
    width: 100%;
    margin-bottom: 14px;
    padding: 9px 12px;
    border: 1px solid #ccc;
    border-radius: 8px;
}

.ezb-option-add-btn {
    width: 100%;
    padding: 12px;
    font-weight: 600;
    color: #fff;
    background: var(--ez-primary);
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

.ezb-option-add-btn:hover {
    background: var(--ez-primary);
}

.ezb-option-note {
    margin-top: 10px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #0a8f3a;
}

/* ICONS */
.ezb-check-icon,
.ezb-cross-icon {
    width: 16px;
    height: 16px;
    margin-top: 3px;
    background-size: contain;
    background-repeat: no-repeat;
}

.ezb-check-icon {
    background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%2300a870' stroke-width='2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");
}

.ezb-cross-icon {
    background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23c0392b' stroke-width='2' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 18L18 6M6 6l12 12'/%3E%3C/svg%3E");
}

/* OTHER ICONS */
.ezb-icon {
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
}

.ezb-icon-time {
    background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23444' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
}

.ezb-icon-language {
    background-image: url("data:image/svg+xml,%3Csvg fill='none' stroke='%23444' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18M3 19h18M8 5v14M16 5v14'/%3E%3C/svg%3E");
}

/* =============================== */
/* SOLD OUT OPTION                 */
/* =============================== */

.ezb-option-soldout {
    opacity: 0.65;
}

.ezb-badge-soldout {
    font-weight: 600;
    color: #888;
    background: #f3f3f3;
}

/* DISABLED CTA */
.ezb-option-soldout .ezb-option-add-btn {
    background: #ccc;
    cursor: not-allowed;
}

.ezb-option-soldout .ezb-option-add-btn:hover {
    background: #ccc;
}

/* SOLD OUT MESSAGE */
.ezb-soldout-message {
    margin-bottom: 12px;
    font-size: 0.85rem;
    text-align: center;
    color: #888;
}
/* =============================== */
/* SOLD OUT – NOTIFY & NEXT DATE   */
/* =============================== */

.ezb-soldout-info {
    text-align: center;
}

.ezb-next-date {
    margin-bottom: 14px;
    font-size: 0.9rem;
    color: #333;
}

/* NOTIFY FORM */
.ezb-notify-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ezb-notify-form label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #555;
}

.ezb-notify-form input {
    padding: 9px 12px;
    font-size: 0.9rem;
    border: 1px solid #ccc;
    border-radius: 8px;
}

.ezb-notify-btn {
    padding: 10px;
    font-weight: 600;
    color: var(--ez-primary);
    background: #e9efff;
    border: none;
    border-radius: 10px;
    cursor: pointer;
}

.ezb-notify-btn:hover {
    background: #dfe7ff;
}

.ezb-cart-item-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.ezb-cart-item-remove {
    font-size: 16px;
    color: #999;
    background: none;
    border: none;
    cursor: pointer;
}

.ezb-cart-item-remove:hover {
    color: #d00;
}

.ezb-option-confirmation {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
}

.ezb-confirm-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke-width: 2;
}

/* INSTANT CONFIRMATION */
.ezb-confirm-instant {
    color: #0a8f3a;
}

.ezb-confirm-instant svg circle {
    fill: #e8f7ee;
}

.ezb-confirm-instant svg path {
    stroke: #0a8f3a;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ON REQUEST */
.ezb-confirm-request {
    color: #f59e0b;
}

.ezb-confirm-request svg circle {
    fill: #f59e0b;
    stroke: none;
}

.ezb-confirm-request svg path {
    stroke: #fff;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.ezb-option-confirmation {
    justify-content: flex-end;
    width: 100%;
}

.ezb-payment-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ezb-cart-preview {
    pointer-events: none;
    transition: opacity .3s ease;
    opacity: 0;
}

.active.ezb-cart-preview {
    pointer-events: auto;
    opacity: 1;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    .ezb-cart-preview {
        bottom: 96px !important;
    }

    .ezb-option-layout {
        grid-template-columns: 1fr;
    }

    .ezb-option-booking {
        padding-top: 20px;
        padding-left: 0;
        border-top: 1px solid #eee;
        border-left: none;
    }

    .ezb-soldout-info {
        text-align: left;
    }

    .ezb-option-card small {
        display: inline-block;
        width: 100%;
        text-align: right;
    }
}

@media (max-width: 576px) {
    .ezb-option-header {
        flex-direction: column;
        gap: 12px;
        margin-bottom: 12px;
    }

    .ezb-option-header > div {
        width: 100%;
    }

    .ezb-option-meta {
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 0;
    }
}

.ezb-no-availability {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 36px 28px;
    text-align: center;
    margin-top: 24px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.04);
}

/* IKONA */
.ezb-no-availability-icon {
    font-size: 32px;
    margin-bottom: 14px;
    opacity: 0.9;
}

/* NASLOV */
.ezb-no-availability h3 {
    font-size: 20px;
    font-weight: 600;
    color: #111827;
    margin-bottom: 10px;
}

/* TEKST */
.ezb-no-availability-text {
    color: #6b7280;
    font-size: 15px;
    max-width: 440px;
    margin: 0 auto 22px;
    line-height: 1.5;
}

/* BUTTONS */
.ezb-no-availability-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-bottom: 14px;
}

/* PRIMARY */
.ezb-btn-primary {
    background: #3b82f6;
    color: white;
    padding: 11px 20px;
    border-radius: 10px;
    font-weight: 500;
    border: none;
    transition: all 0.2s ease;
}

.ezb-btn-primary:hover {
    background: #2563eb;
    transform: translateY(-1px);
}

/* SECONDARY */
.ezb-btn-secondary {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    color: #374151;
    padding: 11px 20px;
    border-radius: 10px;
    font-weight: 500;
}

.ezb-btn-secondary:hover {
    background: #f3f4f6;
}

/* HINT */
.ezb-no-availability-hint {
    font-size: 13px;
    color: #9ca3af;
}

/* koristi isti card stil */
.ezb-no-availability-card {
    text-align: center;
    padding: 32px;
}

/* sadržaj */
.ezb-no-availability-inner {
    max-width: 420px;
    margin: 0 auto;
}

/* ikona */
.ezb-no-availability-icon {
    font-size: 28px;
    margin-bottom: 10px;
    opacity: 0.8;
}

/* tekst */
.ezb-no-availability-text {
    color: #6b7280;
    font-size: 14px;
    margin-bottom: 18px;
}

/* notify box */
.ezb-notify-box {
    margin-top: 20px;
}

/* label */
.ezb-notify-label {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 8px;
}

/* form layout */
.ezb-notify-form {
    display: flex;
    gap: 8px;
    justify-content: center;
}

/* input */
.ezb-notify-input {
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    font-size: 14px;
    width: 220px;
}

/* button */
.ezb-notify-btn {
    padding: 10px 14px;
    border-radius: 8px;
    background: #111827;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
}

.ezb-notify-btn:hover {
    background: #000;
}

/* hint */
.ezb-no-availability-hint {
    margin-top: 14px;
    font-size: 12px;
    color: #9ca3af;
}

/* container */
.ezb-notify-box {
    margin-top: 18px;
}

/* label */
.ezb-notify-label {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 6px;
}

/* inline layout */
.ezb-notify-inline {
    display: flex;
    gap: 8px;
    justify-content: center;
}

/* input */
.ezb-notify-input {
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    font-size: 14px;
    width: 200px;
}

/* button */
.ezb-notify-btn {
    padding: 10px 14px;
    border-radius: 8px;
    background: #f3f4f6;
    color: #111827;
    border: 1px solid #e5e7eb;
    font-size: 14px;
    cursor: pointer;
}

.ezb-notify-btn:hover {
    background: #e5e7eb;
}

/* ukloni centriranje */
.ezb-no-availability-card {
    text-align: left;
}

/* spacing lijevo */
.ezb-no-availability-cta {
    margin-top: 12px;
}

/* hint */
.ezb-no-availability-hint {
    margin-top: 8px;
    font-size: 13px;
    color: #6b7280;
}

/* notify input full width */
.ezb-notify-inline {
    margin-bottom: 10px;
}

.ezb-notify-input {
    width: 100%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

/* notify button da izgleda kao add to cart */
.ezb-notify-main-btn {
    width: 100%;
}

.ezb-badge-unavailable {
    background: #f3f4f6;
    color: #6b7280;
    font-weight: 500;
}
.ezb-btn-icon-right {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.ezb-icon-calendar {
    width: 16px;
    height: 16px;
    opacity: 0.9;
}
.ezb-btn-icon-right:hover .ezb-icon-calendar {
    transform: translateX(2px);
    transition: transform 0.2s ease;
}
.ezb-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.ezb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
}
.ezb-icon svg {
    width: 16px;
    height: 16px;
    display: block;
}
.ezb-option-booking {
    position: relative;
}

/* error */
.ezb-notify-error {
    margin-top: 8px;
    font-size: 13px;
    color: #dc2626;
}

/* success */
.ezb-notify-success {
    margin-top: 8px;
    font-size: 13px;
    color: #16a34a;
}

/* disabled state */
.ezb-notify-success-state .ezb-notify-input {
    background: #f9fafb;
    opacity: 0.7;
    cursor: not-allowed;
}

.ezb-notify-success-state .ezb-option-add-btn {
    opacity: 0.7;
    cursor: default;
}

.ezb-option-cta .ezb-option-add-btn {
    padding-top: 10px;
    width: 260px;
}
.ezb-option-booking--notify .ezb-option-add-btn {
    padding: 10px 16px;
}
.ezb-option-layout {
    align-items: center;
}
.ezb-notify-success {
    font-size: 13px;
    color: #2e7d32;
    margin-top: 6px;
}

.ezb-free-badge {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 999px;
    color: #0a8f3a;
    background: #e8f7ee;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.ezb-option-bottom-row {
    display: grid;
    grid-template-columns: 1fr 260px;
    gap: 16px;
    align-items: center;
}

.ezb-option-bottom-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    text-align: right;
}

.ezb-booking-type-note {
    font-size: 14px;
    font-weight: 600;
    color: #16a34a;
}

.ezb-highlight-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    color: #7a4b00;
    background: linear-gradient(135deg, #fff4bd, #ffd45c, #fff1a8);
    box-shadow: 0 2px 8px rgba(255, 190, 40, 0.45);
    vertical-align: middle;
    text-transform: uppercase;
}

@media (max-width: 768px) {
    .ezb-option-bottom-row {
        grid-template-columns: 1fr;
        gap: 12px;
        align-items: center;
    }

    .ezb-option-bottom-left {
        justify-self: center;
        text-align: center;
    }

    .ezb-option-bottom-right {
        justify-content: center;
        text-align: center;
    }

    .ezb-option-confirmation {
        justify-content: center;
        text-align: center;
    }
}