/* ============================================
   Custom styles for Companies Table Module
   Дополнение к Tailwind CSS
   ============================================ */

/* --- Flag Icons (CSS-based for Chrome compatibility) --- */
.flag-icon {
    display: inline-block;
    width: 1.333em;
    height: 1em;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 0.25em;
}

.flag-icon-rf {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23fff' width='900' height='600'/%3E%3Crect fill='%230039a6' width='900' height='400' y='200'/%3E%3Crect fill='%23d52b1e' width='900' height='200' y='400'/%3E%3C/svg%3E");
}

.flag-icon-bel {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Crect fill='%2300963e' width='600' height='400'/%3E%3Crect fill='%23d52b1e' width='200' height='400'/%3E%3C/svg%3E");
}

.flag-icon-kaz {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%2300afca' width='900' height='600'/%3E%3Cg fill='%23ffc400'%3E%3Ccircle cx='450' cy='300' r='120'/%3E%3C/g%3E%3C/svg%3E");
}

.flag-icon-cz {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23d7141a' width='900' height='300'/%3E%3Crect fill='%23fff' width='900' height='300' y='300'/%3E%3Cpath fill='%2311457e' d='M0 0l450 300L0 600z'/%3E%3C/svg%3E");
}

.flag-icon-sk {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23ffffff' width='900' height='600'/%3E%3Cpath fill='%230b5ea1' d='M0 0l450 300L0 600z'/%3E%3Cpath fill='%23ec001c' d='M0 300l450 300H0z'/%3E%3C/svg%3E");
}

.flag-icon-pl {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 600'%3E%3Crect fill='%23dc143c' width='800' height='600'/%3E%3Crect fill='%23fff' width='800' height='300'/%3E%3C/svg%3E");
}

.flag-icon-ua {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23005bbb' width='900' height='600'/%3E%3Crect fill='%23ffd500' width='900' height='300'/%3E%3C/svg%3E");
}

.flag-icon-ee {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 330 220'%3E%3Crect fill='%23fff' width='330' height='220'/%3E%3Crect fill='%231291ff' width='330' height='147'/%3E%3Crect fill='%23000' width='330' height='73' y='147'/%3E%3C/svg%3E");
}

.flag-icon-lv {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%239e303a' width='900' height='600'/%3E%3Crect fill='%23fff' width='900' height='400' y='100'/%3E%3C/svg%3E");
}

.flag-icon-lt {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Crect fill='%23006a44' width='600' height='400'/%3E%3Crect fill='%23ffb300' width='600' height='200' y='200'/%3E%3Crect fill='%23d2232c' width='600' height='133' y='267'/%3E%3C/svg%3E");
}

/* --- Tabulator Overrides --- */

/* Убираем стандартные границы Tabulator, делаем более чистый вид */
.tabulator {
    border: none !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
}

.tabulator-header {
    border-bottom: 2px solid #e5e7eb !important;
    background-color: #f9fafb !important;
}

.tabulator-header .tabulator-col {
    background-color: #f9fafb !important;
    border-right: 1px solid #e5e7eb !important;
    font-weight: 600 !important;
    color: #374151 !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.05em !important;
}

.tabulator-header .tabulator-col.tabulator-sortable[].tabulator-col-head {
    cursor: pointer;
}

.tabulator-header .tabulator-col.tabulator-sortable[].tabulator-col-head:hover {
    background-color: #f3f4f6 !important;
}

.tabulator-row {
    border-bottom: 1px solid #f3f4f6 !important;
}

.tabulator-row:hover {
    background-color: #f0f9ff !important;
}

.tabulator-row.tabulator-selected {
    background-color: #dbeafe !important;
}

.tabulator-row .tabulator-cell {
    border-right: 1px solid #f3f4f6 !important;
    padding: 0.75rem 0.5rem !important;
}

.tabulator-footer {
    background-color: #f9fafb !important;
    border-top: 1px solid #e5e7eb !important;
    padding: 0.5rem 1rem !important;
}

.tabulator-paginator select {
    border: 1px solid #d1d5db !important;
    border-radius: 0.375rem !important;
    padding: 0.25rem 0.5rem !important;
    font-size: 0.875rem !important;
}

.tabulator-page.active {
    background-color: #3b82f6 !important;
    color: white !important;
    border-radius: 0.375rem !important;
}

.tabulator-page {
    border-radius: 0.375rem !important;
    margin: 0 0.125rem !important;
    padding: 0.25rem 0.5rem !important;
}

/* --- Choices.js Customization --- */

.choices {
    position: relative;
    margin-bottom: 0;
    font-size: 0.875rem;
}

.choices[data-type*="select-multiple"] .choices__inner {
    min-height: 2.5rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    background-color: #fff;
}

.choices[data-type*="select-multiple"] .choices__inner:hover {
    border-color: #9ca3af;
}

.choices__inner {
    background-color: #fff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 0.5rem !important;
    padding: 0.25rem 0.5rem !important;
    min-height: 2.5rem !important;
}

.choices__list--multiple .choices__item {
    background-color: #dbeafe !important;
    border: 1px solid #93c5fd !important;
    border-radius: 0.375rem !important;
    color: #1e40af !important;
    font-size: 0.8125rem !important;
    padding: 0.125rem 0.5rem !important;
    margin: 0.125rem !important;
}

.choices__list--multiple .choices__item .choices__button {
    color: #3b82f6 !important;
    opacity: 0.6 !important;
}

.choices__list--multiple .choices__item .choices__button:hover {
    opacity: 1 !important;
}

.choices__list--dropdown,
.choices__list[aria-expanded] {
    background-color: #fff !important;
    border: 1px solid #d1d5db !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    z-index: 50 !important;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: #f3f4f6 !important;
    color: #111827 !important;
}

.choices__input {
    background-color: #fff !important;
    margin: 0 !important;
    padding: 0.25rem !important;
}

/* --- Modal Animations DISABLED for performance --- */

#company-modal {
    /* animation: fadeIn 0.15s ease-out; */
}

#company-modal:not(.hidden) {
    display: flex;
}

#company-modal .fixed.inset-0.flex.items-center.justify-center.p-4 {
    /* animation: scaleIn 0.2s ease-out; */
}

/* @keyframes fadeIn - disabled */
/* @keyframes scaleIn - disabled */

/* --- Details Panel --- */

#details-panel .bg-white.rounded-lg.border.border-gray-200 {
    /* transition: all 0.2s ease; */
}

#details-panel .bg-white.rounded-lg.border.border-gray-200:hover {
    border-color: #bfdbfe;
    box-shadow: 0 1px 3px rgba(59, 130, 246, 0.1);
}

/* --- Toast Notifications --- */

.toast-notification {
    animation: slideInRight 0.3s ease-out, fadeOut 0.3s ease-in 2.7s;
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

/* --- Responsive --- */

@media (max-width: 1024px) {
    .lg\:grid-cols-2 {
        grid-template-columns: 1fr !important;
    }

    .h-\[calc\(100vh-12rem\)\] {
        height: auto !important;
        min-height: 300px;
    }

    .max-w-4xl {
        max-width: 95vw;
    }
}

/* --- Scrollbar Styling --- */

/* Горизонтальная прокрутка для таблицы */
#companies-table {
    overflow-x: auto !important;
}

#companies-table .tabulator-tableholder {
    overflow-x: auto !important;
}

#companies-table .tabulator-table {
    min-width: 100% !important;
}

#details-panel::-webkit-scrollbar,
#modal-body::-webkit-scrollbar {
    width: 6px;
}

#details-panel::-webkit-scrollbar-track,
#modal-body::-webkit-scrollbar-track {
    background: #f3f4f6;
    border-radius: 3px;
}

#details-panel::-webkit-scrollbar-thumb,
#modal-body::-webkit-scrollbar-thumb {
    background: #d1d5db;
    border-radius: 3px;
}

#details-panel::-webkit-scrollbar-thumb:hover,
#modal-body::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* --- Tabulator Header Filter --- */

.tabulator-header-filter input {
    border: 1px solid #d1d5db !important;
    border-radius: 0.375rem !important;
    padding: 0.25rem 0.5rem !important;
    font-size: 0.8125rem !important;
    width: 100% !important;
    margin-top: 0.25rem !important;
}

.tabulator-header-filter input:focus {
    border-color: #3b82f6 !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2) !important;
}

/* --- Country Flag Styles --- */

.country-flag {
    display: inline-block;
    width: 16px;
    height: 12px;
    background-size: cover;
    background-position: center;
    margin-right: 4px;
    vertical-align: middle;
}

.country-flag-rf { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23fff' width='900' height='600'/%3E%3Crect fill='%230039A6' width='900' height='400' y='200'/%3E%3Crect fill='%23D52B1E' width='900' height='200' y='400'/%3E%3C/svg%3E"); }
.country-flag-by { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23009739' width='900' height='600'/%3E%3Crect fill='%23D22630' width='900' height='400'/%3E%3Cpath fill='%23fff' d='M0 0h270v600H0z'/%3E%3Cpath fill='%23D22630' d='M0 0h180v600H0z'/%3E%3C/svg%3E"); }
.country-flag-kz { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 600'%3E%3Crect fill='%2300AFCA' width='1200' height='600'/%3E%3Cpath fill='%23fee300' d='M0 300l600-300 600 300-600 300z'/%3E%3C/svg%3E"); }
.country-flag-cz { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23fff' width='900' height='600'/%3E%3Crect fill='%23d7141a' width='900' height='300' y='300'/%3E%3Cpath fill='%2311457e' d='M0 0l450 300L0 600z'/%3E%3C/svg%3E"); }
.country-flag-sk { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect fill='%23fff' width='900' height='600'/%3E%3Crect fill='%230b4ea2' width='900' height='400' y='200'/%3E%3Cpath fill='%23ee1c25' d='M0 0l450 300L0 600z'/%3E%3C/svg%3E"); }
.country-flag-pl { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 600'%3E%3Crect fill='%23fff' width='800' height='600'/%3E%3Crect fill='%23dc143c' width='800' height='300' y='300'/%3E%3C/svg%3E"); }
.country-flag-ua { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 800'%3E%3Crect fill='%23005bbb' width='1200' height='800'/%3E%3Crect fill='%23ffd500' width='1200' height='400' y='400'/%3E%3C/svg%3E"); }
.country-flag-ee { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 330 220'%3E%3Crect fill='%23fff' width='330' height='220'/%3E%3Crect fill='%230072CE' width='330' height='147'/%3E%3Crect fill='%23000' width='330' height='73' y='147'/%3E%3C/svg%3E"); }
.country-flag-lv { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Crect fill='%239E3039' width='600' height='400'/%3E%3Crect fill='%23fff' width='600' height='267' y='67'/%3E%3C/svg%3E"); }
.country-flag-ltu { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400'%3E%3Crect fill='%23006A44' width='600' height='400'/%3E%3Crect fill='%23FDB913' width='600' height='267' y='133'/%3E%3Crect fill='%23C1272D' width='600' height='133' y='267'/%3E%3C/svg%3E"); }

/* --- Print Styles --- */

@media print {
    nav, .bg-white.rounded-xl.border, button {
        display: none !important;
    }
}