/*!
Theme Name: Smart Living BD
Theme URI: http://underscores.me/
Author: Md. Masum Billah
Author URI: https://www.turboseotools.com
Description: Accident Business USA
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: laywer
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Business is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&family=Roboto:wght@400;500&display=swap');

/* ==================================================
   Base Styles
================================================== */
body {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px;
    line-height: 1.65;
    color: #333;
    background-color: #E7EDEE;
    margin: 0;
    padding: 0;
}

a {
    color: #0074ba;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}
strong {font-weight: bold;font-family: 'Merriweather', serif;}
/* ==================================================
   Headings
================================================== */
h1,
h2,
h3,
h4,
h5,
h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    font-family: 'Merriweather', serif;
    color: #222;
    margin: 0 0 15px 0;
    line-height: 1.3;
}

h1 {
    font-size: 1.3rem;
    margin-bottom: 5px;
}

h2 {
    font-size: 1.2rem;
}

h3 {
    font-size: 1.1rem;
}

h4 {
    font-size: 1rem;
}

h5 {
    font-size: 1rem;
}

h6 {
    font-size: 1rem;
}
.entry-content h2 {
    margin-top: 30px;
}
.entry-content ol {
    margin-bottom: 20px;
    margin-left: 0;
}
/* ==================================================
   Paragraphs & Lists
================================================== */
p {
    margin: 0 0 16px 0;
    font-size: 1rem;
    color: #444;
}

ul,
ol {
    margin: 0 0 16px 25px;
}

li {
    margin-bottom: 8px;
}

/* ==================================================
   Blockquotes & Code
================================================== */
blockquote {
    border-left: 4px solid #1e73be;
    padding-left: 15px;
    margin: 0 0 20px 0;
    color: #555;
    font-style: italic;
    background-color: #f9f9f9;
}

pre,
code {
    font-family: 'Courier New', monospace;
    background-color: #f4f4f4;
    padding: 5px 10px;
    border-radius: 4px;
    overflow-x: auto;
}
.form-group {
    margin-bottom: 15px;
}
input, textarea {
    width: 95%;
    padding: 10px;
    border: 2px solid #dddddd;
    border-radius: 4px;
}
.comment-form-cookies-consent input {width: auto !important;}
input#submit {
    background: #1e73be;
    color: #fff;
    width: auto !important;
}
/* ==================================================
   Tables
================================================== */
table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

th,
td {
    padding: 10px;
    border: 1px solid #ddd;
    text-align: left;
}

th {
    background-color: #f7f7f7;
}

/* ==================================================
   Buttons
================================================== */
button,
.btn {
    display: inline-block;
    padding: 10px 20px;
    background-color: #1e73be;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

button:hover,
.btn:hover {
    background-color: #145a96;
}

/* ==================================================
   AdSense Ready Classes
================================================== */
.header-ad,
.adsense-inline,
.sidebar-ad {
    text-align: center;
    margin: 20px 0;
}

/* In-content ad spacing */
.adsense-inline {
    margin: 25px 0;
}

/* ==================================================
   Responsive Typography
================================================== */
@media (max-width: 1024px) {
    h1 {
        font-size: 1.4rem;
    }

    h2 {
        font-size: 1.3rem;
    }

    h3 {
        font-size: 1.2rem;
    }
}

@media (max-width: 768px) {
    body {
        font-size: 15px;
    }

    h1 {
        font-size: 1.3rem;
    }

    h2 {
        font-size: 1.2rem;
    }

    h3 {
        font-size: 1.1rem;
    }
}



/* ==================================================
   Layout
================================================== */

.container {
    max-width: 985px;
    margin: 0 auto;
}

.container .inside {
    background-color: #ffffff;
    padding: 20px;
    margin: 40px 0;
}

.site-header {
    background: #ffffff;
    color: #ddd;
}

.site-header a {
    color: #ffffff;
}

/* Container flex for branding left and menu right */
.site-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

/* Branding */
.site-branding {
    flex: 1 1 auto;
}

/* Hamburger Button */
.menu-toggle {
    display: none;
    background: #1e73be;
    color: #fff;
    border: none;
    padding: 10px 15px;
    font-size: 22px;
    cursor: pointer;
    border-radius: 4px;
    position: relative;
    z-index: 1001;
    order: 1;
    /* left side */
}
.mobile-menu-logo {display: none;}
/* Change to cross when active */
.menu-toggle.active::before {
    content: "✕";
}

/* Desktop Menu */
.main-navigation .menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: flex-end;
}

.main-navigation .menu li {
    position: relative;
}

.main-navigation .menu li a {
    display: block;
    padding: 10px 15px;
    color: #222;
    text-decoration: none;
}

.main-navigation .menu li a:hover {
    color: #1e73be;
}

/* Dropdown */
.main-navigation .menu li ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    min-width: 200px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    z-index: 9999;
}

.main-navigation .menu li:hover>ul {
    display: block;
}

.main-navigation .menu li ul li ul {
    left: 100%;
    top: 0;
}
ul.sub-menu {
    padding: 0;
    list-style: none;
    margin: auto 0px;
}
ul.sub-menu li {
    border-bottom: 1px solid #ededed;
    margin-bottom: 0;
}
/* ==================================================
   Mobile Slide-in Menu
================================================== */
@media (max-width: 1024px) {
    .menu-toggle {
        display: inline-block;
    }
    .mobile-menu-logo {display: block;}

    .main-navigation {
        position: fixed;
        top: 0;
        left: -250px;
        /* hidden by default */
        width: 250px;
        height: 100%;
        background: #fff;
        overflow-y: auto;
        transition: left 0.3s ease;
        z-index: 1000;
        /* space for header */
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.2);
    }

    .main-navigation.active {
        left: 0;
    }

    .main-navigation .menu {
        flex-direction: column;
    }

    .main-navigation .menu li {
        display: block;
        border-bottom: 1px solid #eee;
    }

    .main-navigation .menu li a {
        padding: 5px 15px;
    }

    .main-navigation .menu li ul {
        position: relative;
        display: none;
        box-shadow: none;
    }

    .main-navigation .menu li.active>ul {
        display: block;
    }
}


/* Container Flex for 3-column layout */
.triple-layout {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin: 20px auto;
    padding: 0;
}

.triple-layout .sidebar-left {
    order: -1;
    /* optional if you want left first */
    width: 25%;
}

.triple-layout .content-area {
    width: 55%;
}

.triple-layout .sidebar-right {
    order: 1;
    width: 20%;
}

.sidebar ul,
.sidebar ol {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

/* Container Flex: Content + Right Sidebar */
.single-layout {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 20px auto;
    padding: 0;
}

/* Content Area */
.single-layout .content-area {
    width: 70%;
}

/* Right Sidebar */
.single-layout .sidebar-right {
    width: 28%;
}

.entry-header {
    border-bottom: 1px solid #e7edee;
}

.sidebar-left {
    border-right: 1px solid #e7edee;
}

.sidebar-right {
    border-left: 1px solid #e7edee;
    padding-left: 15px;
}

section.widget_block {
    margin-bottom: 30px;
}

.wp-block-heading {
    font-size: 1.1rem;
}

/* Responsive: Stack on mobile/tablet */
@media (max-width: 1024px) {
    .triple-layout {
        flex-direction: column;
    }

    .single-layout {
        flex-direction: column;
    }

    .sidebar-left,
    .sidebar-right,
    .content-area {
        width: 100%;
        margin-bottom: 20px;
    }

}

.entry-header,
.business-header {
    padding-bottom: 0px;
}

/* Post Row Layout */
.post-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
    align-items: flex-start;
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 6px;
}

/* Featured Image Left */
.post-featured {
    width: 30%;
    flex-shrink: 0;
}

.post-featured img {
    width: 100%;
    height: auto;
    border-radius: 4px;
}

.sticky {
    border: 1px solid #e7c5c5;
    background: #fff9f1;
}

/* Post Content Right */
.post-content {
    width: 65%;
}

.post-content h2.entry-title {
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.post-content .entry-excerpt {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 15px;
}

.read-more-btn {
    display: inline-block;
    padding: 8px 15px;
    background: #1e73be;
    color: #fff;
    border-radius: 4px;
    text-decoration: none;
}

.read-more-btn:hover {
    background: #145a96;
}

/* Inline Ad spacing */
.adsense-inline {
    margin-top: 20px;
}

/* Responsive: stack image above content on tablet/mobile */
@media (max-width: 1024px) {
    .post-row {
        flex-direction: column;
    }

    .post-featured,
    .post-content {
        width: 100%;
    }

    .post-featured img {
        margin-bottom: 15px;
    }
}


/* Pagination */
.pagination,
.wp-block-query-pagination {
    text-align: center;
    margin-top: 30px;
}

.pagination a,
.pagination span,
.wp-block-query-pagination a,
.wp-block-query-pagination span {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 12px;
    border: 1px solid #ddd;
    color: #222;
    text-decoration: none;
}

.pagination a:hover {
    background: #1e73be;
    color: #fff;
}

/* ==================================================
   Footer
================================================== */
.site-footer {
    text-align: center;
    padding: 30px 15px;
    background-color: #F3F6F5;
    color: #424E4E;
}

/* Footer links */
.site-footer a {
    color: #424E4E;
    text-decoration: none;
}

.site-footer a:hover {
    text-decoration: underline;
}

/* Directory: List layout - pure CSS */
.directory-container {
    max-width: 986px;
    margin: 36px auto;
    padding: 0 16px;
    color: #222;
}

.directory-header {
    margin-bottom: 18px;
}

.directory-title {
    margin: 0 0 12px 0;
    font-size: 28px;
    font-weight: 700;
}

.directory-filters .filter-row {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.directory-filters input[type="search"],
.directory-filters select {
    padding: 8px 10px;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    font-size: 14px;
}

.directory-filters input[type="search"] {
    min-width: 280px;
    flex: 1 1 280px;
}

.directory-filters select {
    min-width: 150px;
    flex: 0 0 160px;
}

.btn-filter {
    padding: 8px 14px;
    background: #0b66c3;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
}

.list-wrap {
    display: block;
    margin-bottom: 18px;
}

.business-row {
    display: flex;
    gap: 16px;
    padding: 16px;
    border: 1px solid #efefef;
    border-radius: 6px;
    margin-bottom: 14px;
    background: #fff;
    align-items: flex-start;
}

.business-photo {
    flex: 0 0 120px;
    max-width: 120px;
    height: 120px;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.business-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.business-body {
    flex: 1 1 auto;
}

.business-name {
    margin: 0 0 6px 0;
    font-size: 20px;
    line-height: 1.15;
}

.business-name a {
    color: #111;
    text-decoration: none;
}

.business-name a:hover {
    text-decoration: underline;
}

.business-meta {
    margin-bottom: 8px;
    font-size: 13px;
    color: #666;
}

.meta-item {
    margin-right: 10px;
    display: inline-block;
}

.business-desc {
    color: #444;
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 1.4;
}

.business-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.btn.small {
    padding: 6px 10px;
    border-radius: 4px;
    border: 1px solid #e1e1e1;
    background: #fff;
    text-decoration: none;
    color: #333;
    font-size: 13px;
}

.badges {
    display: inline-flex;
    gap: 6px;
    margin-left: 6px;
    align-items: center;
}

.badge {
    display: inline-block;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 16px;
    color: #fff;
    font-weight: 700;
}

.badge.featured {
    background: #f4a940;
}

.badge.paid {
    background: #2a9d8f;
}

.rating-block {
    margin-left: 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #333;
}

.star {
    color: #f2b01e;
    font-size: 14px;
    margin-right: 1px;
}

.star.empty {
    color: #ddd;
}

.rating-number {
    font-weight: 700;
    margin-left: 6px;
    font-size: 13px;
    color: #222;
}

.directory-pagination {
    margin-top: 12px;
    text-align: center;
}

/* No results */
.no-results {
    padding: 28px;
    text-align: center;
    color: #666;
}

/* Responsive */
@media (max-width: 860px) {
    .content-area, .sidebar-right, .sidebar-left {width: 100% !important;}
    .directory-container {
        padding: 0 12px;
    }
    .sidebar-left {display: none;}
    .business-row {
        flex-direction: row;
        gap: 12px;
    }

    .business-photo {
        flex: 0 0 100px;
        max-width: 100px;
        height: 100px;
    }

    .directory-filters .filter-row {
        gap: 8px;
    }
}

@media (max-width: 560px) {
    .directory-filters .filter-row {
        flex-direction: column;
        align-items: stretch;
    }

    .directory-filters input[type="search"] {
        min-width: 100%;
        flex: 1 1 auto;
    }

    .directory-filters select {
        width: 100%;
        flex: 1 1 auto;
    }

    .business-row {
        flex-direction: column;
        align-items: stretch;
    }

    .business-photo {
        width: 100%;
        height: 200px;
        max-width: none;
    }
}


/* Minimal styling — paste into your style.css if you prefer */
/* Header block */
.business-header {
    grid-column: 1 / -1;
    display: flex;
    gap: 18px;
    align-items: flex-start;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
}
.business-header p {margin-bottom: 0px;}

.business-header .business-photo {width: 100px;height: 100px;}
.business-photo {
    flex: 0 0 200px;
    width: 200px;
    height: 200px;
    overflow: hidden;
    border-radius: 6px;
    background: #f5f5f5;
}

.business-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.business-header-info {
    flex: 1 1 auto;
}

.business-title {
    margin: 0 0 8px;
    font-size: 26px;
}

.badge {
    display: inline-block;
    padding: 6px 10px;
    font-weight: 700;
    border-radius: 20px;
    font-size: 13px;
    color: #fff;
    margin-right: 8px;
}

.badge.featured {
    background: #f39c12;
}

.rating-summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
    font-weight: 600;
    color: #111;
}

.meta-inline {
    color: #666;
    font-size: 14px;
    margin-top: 6px;
}

/* Review box */
.reviews-section {
    margin-top: 22px;
}

.avg-rating {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 10px;
}

.stars {
    color: #f2b01e;
    font-size: 16px;
}

/* Review form (logged-in or guest) */
.review-form {
    margin-top: 12px;
    border: 1px solid #eee;
    padding: 14px;
    border-radius: 6px;
    background: #fafafa;
}

.review-form input[type="text"],
.review-form input[type="email"],
.review-form textarea,
.review-form select {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.review-submit {
    background: #0b66c3;
    color: #fff;
    border: none;
    padding: 10px 14px;
    border-radius: 4px;
    cursor: pointer;
}

/* Review list */
.single-review {
    border-bottom: 1px solid #f0f0f0;
    padding: 14px 0;
}

.single-review .r-meta {
    font-size: 13px;
    color: #666;
    margin-bottom: 6px;
}

/* Sidebar */
.business-sidebar {
    padding: 14px;
    border: 1px solid #eee;
    border-radius: 6px;
    background: #fff;
}

.sidebar-section {
    margin-bottom: 16px;
}

.btn-contact {
    display: block;
    text-align: center;
    background: #0b66c3;
    color: #fff;
    padding: 10px;
    border-radius: 6px;
    text-decoration: none;
    margin-bottom: 8px;
}

.btn-appoint {
    display: block;
    text-align: center;
    background: #2a9d8f;
    color: #fff;
    padding: 10px;
    border-radius: 6px;
    text-decoration: none;
}

/* Related */
.related-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.related-item {
    display: flex;
    gap: 12px;
    border: 1px solid #f0f0f0;
    padding: 10px;
    border-radius: 6px;
    align-items: center;
}

.related-item img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 6px;
}

/* FAQ */
.faq {
    margin-top: 18px;
}

.faq-item {
    margin-bottom: 10px;
}

.faq-question {
    font-weight: 700;
}

.faq-answer {
    margin-top: 6px;
    color: #444;
}


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

.portal-list {
    list-style: none;
    padding: 0;
    margin: 0;

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px 24px;
}

.portal-list li {
    position: relative;
    padding-left: 26px;
}

.portal-list li::before {
    content: "✔";
    position: absolute;
    left: 0;
    top: 2px;
    color: #2c7be5;
    font-size: 14px;
}

.portal-list a {
    text-decoration: none;
    color: #333;
}

.portal-list a:hover {
    text-decoration: underline;
}