/*
Theme Name: MaxGate New
Theme URI: https://maxgate.io
Description: A custom Tailwind-based theme to match the redesigned MaxGate landing page.
Version: 2.0
Author: MaxGate Team
Author URI: https://maxgate.io
*/

/* 
  Since we are using the Tailwind CDN in header.php, 
  we only need minimal custom CSS overrides here. 
  Most styling will be handled by Tailwind utility classes directly in the PHP templates.
*/

/* WordPress Core Alignment Classes */
.alignnone {
    margin: 5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}
.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}
.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}
a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}
a img.alignnone {
    margin: 5px 20px 20px 0;
}
a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}
a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}
.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}
.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}
.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}
.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* 1. Сброс всех дефолтных рамок Tailwind Typography */
.prose table, 
.prose thead, 
.prose tbody, 
.prose tr, 
.prose th, 
.prose td {
    border: none !important;
}

/* 2. Современные стили для таблиц со скругленными углами */
.prose table {
    width: 100%;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 2.5rem 0 !important;
    font-size: 0.95rem;
    line-height: 1.6;
    border-radius: 0.75rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* 3. Шапка таблицы */
.prose table th {
    background-color: rgba(0, 0, 0, 0.03) !important;
    color: #111827 !important;
    font-weight: 600 !important;
    padding: 1rem 1.25rem !important;
    text-align: left;
    vertical-align: bottom;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* 4. Ячейки с данными */
.prose table td {
    padding: 1rem 1.25rem !important;
    vertical-align: top;
    color: #374151 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* 5. Убираем "внутренние" правые границы у крайнего правого столбца */
.prose table th:last-child,
.prose table td:last-child {
    border-right: none !important;
}

/* 6. Убираем "внутреннюю" нижнюю границу у самого нижнего ряда */
.prose table tr:last-child td {
    border-bottom: none !important;
}

/* 7. Подсветка строк для визуального удобства */
.prose table tbody tr:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.prose table tbody tr {
    transition: background-color 0.2s ease;
}

.prose table tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

/* 8. Темная тема (Dark mode) */
@media (prefers-color-scheme: dark) {
    .prose table {
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
    
    .prose table th {
        background-color: rgba(255, 255, 255, 0.05) !important;
        color: #ffffff !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
    
    .prose table td {
        color: #e5e7eb !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
    
    .prose table tbody tr:nth-child(even) {
        background-color: rgba(255, 255, 255, 0.02) !important;
    }
    
    .prose table tbody tr:hover {
        background-color: rgba(255, 255, 255, 0.07) !important;
    }
}