/*

Theme Name: RentML Car Rental

Theme URI: https://madeira-rental.org

Author: Cursor

Author URI: https://cursor.sh

Description: Modern car rental theme with multilingual support

Version: 2.5

License: GNU General Public License v2 or later

License URI: http://www.gnu.org/licenses/gpl-2.0.html

Text Domain: rentml

*/



:root {

    --primary-color: #007bff;

    --primary-dark: #0056b3;

    --secondary-color: #28a745;

    --text-color: #333;

    --text-light: #666;

    --bg-color: #f8f9fa;

    --white: #ffffff;

    --dark: #343a40;

    --border-color: #dee2e6;

    --shadow: 0 2px 10px rgba(0,0,0,0.1);

    --shadow-lg: 0 4px 20px rgba(0,0,0,0.15);

    --transition: all 0.3s ease;

}



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



body {

    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    margin: 0;

    padding: 0;

    background: var(--bg-color);

    color: var(--text-color);

    line-height: 1.7;

    font-size: 16px;

    display: flex;

    flex-direction: column;

    min-height: 100vh;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



/* Reset WordPress default styles that might interfere */

body .wp-block-group,

body .wp-block-columns,

body .wp-block-column {

    margin: 0;

    padding: 0;

}



body p {

    margin-bottom: 1.5em;

}



.container {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 20px;

    width: 100%;

}



/* Header */

header {

    background: var(--white);

    box-shadow: var(--shadow);

    padding: 1rem 0;

    position: sticky;

    top: 0;

    z-index: 1000;

    transition: var(--transition);

}



header.scrolled {

    padding: 0.5rem 0;

}



/* Header Container - Centered Logo */

header .container.header-container {

    display: flex;

    justify-content: center; /* Center the logo */

    align-items: center;

}



.site-logo {

    text-align: center;

}



.site-logo a {

    display: inline-block;

    text-decoration: none;

    transition: var(--transition);

}



.site-logo img {

    height: 50px;

    width: auto;

    display: block;

    transition: var(--transition);

}



.site-logo a:hover {

    transform: translateY(-2px);

}



/* Hero Section */

.hero {

    background: linear-gradient(135deg, rgba(0,123,255,0.9) 0%, rgba(0,86,179,0.9) 100%), 

                url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=1600&q=80');

    background-size: cover;

    background-position: center;

    background-attachment: fixed;

    color: var(--white);

    padding: 120px 0;

    text-align: center;

    position: relative;

    overflow: hidden;

}



.hero::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: radial-gradient(circle at 30% 50%, rgba(0,123,255,0.3) 0%, transparent 50%);

}



.hero .container {

    position: relative;

    z-index: 1;

}



.hero h1 {

    font-size: clamp(2.5rem, 5vw, 4rem);

    margin-bottom: 20px;

    text-shadow: 2px 2px 4px rgba(0,0,0,0.3);

    font-weight: 700;

    line-height: 1.2;

    animation: fadeInUp 0.8s ease;

}



.hero p {

    font-size: clamp(1.1rem, 2vw, 1.5rem);

    margin-bottom: 40px;

    opacity: 0.95;

    max-width: 700px;

    margin-left: auto;

    margin-right: auto;

    animation: fadeInUp 1s ease;

}



/* Buttons */

.btn {

    display: inline-block;

    padding: 14px 35px;

    background: var(--white);

    color: var(--primary-color);

    text-decoration: none;

    border-radius: 50px;

    transition: var(--transition);

    font-weight: 600;

    font-size: 1.1rem;

    border: 2px solid transparent;

    cursor: pointer;

    animation: fadeInUp 1.2s ease;

    box-shadow: 0 4px 15px rgba(0,0,0,0.2);

}



.btn:hover {

    background: var(--primary-color);

    color: var(--white);

    transform: translateY(-3px);

    box-shadow: 0 6px 20px rgba(0,123,255,0.4);

}



.btn-primary {

    background: var(--primary-color);

    color: var(--white);

}



.btn-primary:hover {

    background: var(--primary-dark);

}



.btn-secondary {

    background: transparent;

    color: var(--white);

    border-color: var(--white);

}



.btn-secondary:hover {

    background: var(--white);

    color: var(--primary-color);

}



/* Main Content */

.site-content {

    flex: 1;

    padding: 60px 0;

}



/* Articles */

article {

    background: var(--white);

    padding: 50px;

    border-radius: 12px;

    box-shadow: var(--shadow);

    margin-bottom: 40px;

    transition: var(--transition);

    overflow: hidden;

}



article:hover {

    box-shadow: var(--shadow-lg);

    transform: translateY(-5px);

}



/* WordPress content wrapper */

.entry-content,

.site-content {

    width: 100%;

}



/* Better spacing for content blocks */

.entry-content > *:first-child {

    margin-top: 0;

}



.entry-content > *:last-child {

    margin-bottom: 0;

}



article h1,

article h2 {

    margin-top: 0;

    margin-bottom: 20px;

    color: var(--dark);

    font-weight: 700;

    line-height: 1.3;

}



article h1 {

    font-size: 2.5rem;

}



article h2 {

    font-size: 2rem;

    border-bottom: 3px solid var(--primary-color);

    padding-bottom: 10px;

}



article h3 {

    font-size: 1.5rem;

    margin-top: 30px;

    margin-bottom: 15px;

    color: var(--text-color);

}



article p {

    margin-bottom: 20px;

    color: var(--text-light);

    line-height: 1.8;

}



article a {

    color: var(--primary-color);

    text-decoration: none;

    transition: var(--transition);

    border-bottom: 1px solid transparent;

}



article a:hover {

    color: var(--primary-dark);

    border-bottom-color: var(--primary-dark);

}



article ul,

article ol {

    margin: 20px 0;

    padding-left: 30px;

}



article li {

    margin-bottom: 10px;

    color: var(--text-light);

}



article img {

    max-width: 100%;

    height: auto;

    border-radius: 8px;

    margin: 30px 0;

    box-shadow: var(--shadow);

}



article blockquote {

    border-left: 4px solid var(--primary-color);

    padding-left: 20px;

    margin: 30px 0;

    font-style: italic;

    color: var(--text-light);

}



/* Footer */

footer {

    background: var(--dark);

    color: #e9ecef;

    padding: 50px 0 30px;

    text-align: center;

    margin-top: auto;

}



footer .container {

    display: flex;

    flex-direction: column;

    gap: 20px;

}



footer p {

    margin: 0;

    opacity: 0.8;

}



footer a {

    color: #e9ecef;

    text-decoration: none;

    transition: var(--transition);

}



footer a:hover {

    color: var(--primary-color);

}



/* Animations */

@keyframes fadeInUp {

    from {

        opacity: 0;

        transform: translateY(30px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}



/* Responsive Design */

@media (max-width: 768px) {

    .hero {

        padding: 80px 0;

        background-attachment: scroll;

    }

    

    .hero h1 {

        font-size: 2rem;

    }

    

    .hero p {

        font-size: 1.1rem;

    }

    

    article {

        padding: 30px 20px;

    }

    

    article h1 {

        font-size: 1.8rem;

    }

    

    article h2 {

        font-size: 1.5rem;

    }

    

    .btn {

        padding: 12px 25px;

        font-size: 1rem;

    }

    

    .site-logo img {

        height: 40px;

    }

}



@media (max-width: 480px) {

    .container {

        padding: 0 15px;

    }

    

    article {

        padding: 25px 15px;

    }

    

    .entry-content {

        font-size: 1rem;

    }

}



/* Force theme styles to override WordPress defaults */

body.rentml-theme {

    background: var(--bg-color) !important;

    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;

}



body.rentml-theme .site-content {

    background: transparent !important;

}



/* Ensure proper container width */

body.rentml-theme .site-content .container {

    max-width: 1200px;

    margin: 0 auto;

    padding: 0 20px;

}



/* Better content display */

body.rentml-theme .entry-content {

    max-width: 100%;

    word-wrap: break-word;

}



/* Fix for WordPress blocks */

body.rentml-theme .wp-block-group__inner-container,

body.rentml-theme .wp-block-columns {

    max-width: 1200px;

    margin-left: auto;

    margin-right: auto;

    padding: 0 20px;

}



/* Utility Classes */

.text-center {

    text-align: center;

}



.mt-1 { margin-top: 1rem; }

.mt-2 { margin-top: 2rem; }

.mt-3 { margin-top: 3rem; }

.mb-1 { margin-bottom: 1rem; }

.mb-2 { margin-bottom: 2rem; }

.mb-3 { margin-bottom: 3rem; }



/* WordPress specific fixes */

.wp-block-group,

.wp-block-columns {

    margin-bottom: 2rem;

}



/* Better typography for multilingual content */

.entry-content {

    font-size: 1.1rem;

    line-height: 1.8;

}



.entry-content p {

    margin-bottom: 1.5em;

    color: var(--text-light);

}



/* Improve readability */

.entry-content h2,

.entry-content h3,

.entry-content h4 {

    margin-top: 2em;

    margin-bottom: 1em;

    color: var(--dark);

    font-weight: 700;

}



/* Better list styling */

.entry-content ul,

.entry-content ol {

    margin: 1.5em 0;

    padding-left: 2em;

}



.entry-content li {

    margin-bottom: 0.75em;

    line-height: 1.8;

}



/* Table Styling - High Specificity to Override Resets */

table,

.entry-content table,

body.rentml-theme table {

    width: 100% !important;

    border-collapse: collapse !important;

    margin: 2rem 0;

    background: var(--white);

    box-shadow: 0 2px 8px rgba(0,0,0,0.05);

    border-radius: 8px;

    overflow: hidden;

    border: 1px solid #aaa !important; /* Outer border */

}



thead,

.entry-content thead,

body.rentml-theme thead {

    background: var(--primary-color);

    color: var(--white);

}



th,

.entry-content th,

body.rentml-theme th {

    padding: 15px !important;

    text-align: left;

    font-weight: 600;

    border: 1px solid #999 !important; /* Darker border for headers */

    background-color: var(--primary-color) !important;

    color: #fff !important;

}



td,

.entry-content td,

body.rentml-theme td {

    padding: 15px !important;

    border: 1px solid #ccc !important; /* Visible gray border for cells */

    color: var(--text-color);

}



/* Striped rows */

tr:nth-child(even),

.entry-content tr:nth-child(even) {

    background-color: #f2f2f2 !important; /* Slightly darker stripe */

}



tr:hover,

.entry-content tr:hover {

    background-color: #e0e0e0 !important; /* Highlight on hover */

}



/* Responsive Tables */

@media (max-width: 768px) {

    table {

        display: block;

        overflow-x: auto;

        white-space: nowrap;

    }

}



/* Front Page - Country Selector */

.front-page-content {

    padding: 40px 0;

}



.page-title {

    font-size: 2.5rem;

    font-weight: 700;

    color: var(--text-color);

    margin-bottom: 40px;

    text-align: center;

}



.country-selector {

    margin: 60px 0;

}



.section-title {

    font-size: 2rem;

    font-weight: 600;

    color: var(--text-color);

    margin-bottom: 20px;

    text-align: center;

}



.section-description {

    font-size: 1.2rem;

    color: #666;

    margin-bottom: 50px;

    text-align: center;

}



.countries-grid {

    display: grid;

    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));

    gap: 20px;

    margin: 40px 0;

}



.country-item {

    background: var(--white);

    border-radius: 12px;

    box-shadow: 0 2px 8px rgba(0,0,0,0.08);

    transition: all 0.3s ease;

    overflow: hidden;

}



.country-item:hover {

    transform: translateY(-5px);

    box-shadow: 0 8px 20px rgba(0,0,0,0.15);

}



.country-link {

    display: flex;

    align-items: center;

    padding: 20px 25px;

    text-decoration: none;

    color: var(--text-color);

    transition: background-color 0.3s ease;

}



.country-link:hover {

    background-color: #f8f9fa;

}



.country-flag {

    font-size: 2.5rem;

    margin-right: 15px;

    line-height: 1;

    display: inline-block;

    min-width: 40px;

    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;

}



.country-name {

    font-size: 1.1rem;

    font-weight: 600;

    color: var(--primary-color);

}



/* Responsive adjustments for country grid */

@media (max-width: 768px) {

    .countries-grid {

        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));

        gap: 15px;

    }

    

    .page-title {

        font-size: 2rem;

    }

    

    .section-title {

        font-size: 1.5rem;

    }

    

    .country-link {

        padding: 15px 20px;

    }

    

    .country-flag {

        font-size: 2rem;

        margin-right: 12px;

    }

    

    .country-name {

        font-size: 1rem;

    }

}



@media (max-width: 480px) {

    .countries-grid {

        grid-template-columns: 1fr;

    }

}





/* Loading Animation */

.loading {

    opacity: 0;

    animation: fadeIn 0.5s ease forwards;

}



@keyframes fadeIn {

    to {

        opacity: 1;

    }

}