@charset "UTF-8";

/*
Theme Name: Twenty Twenty-One
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 7.0
Requires PHP: 5.6
Version: 2.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog, portfolio

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/

/**
 * SETTINGS
 * File-header..........The file header for the themes style.css file.
 * Fonts................Any font files, if the project needs specific fonts.
 * Global...............Project-specific, globally available variables.
 *
 * TOOLS
 * Functions............Global functions.
 * Mixins...............Global mixins.
 *
 * GENERIC
 * Normalize.css........Normalise browser defaults.
 * Breakpoints..........Mixins and variables for responsive styles
 * Vertical-margins.....Vertical spacing for the main components.
 * Reset................Reset specific elements to make them easier to style in other contexts.
 * Clearings............Clearings for the main components.
 *
 * ELEMENTS
 * Blockquote...........Default blockquote.
 * Forms................Element-level form styling.
 * Headings.............H1–H6
 * Links................Default links.
 * Lists................Default lists.
 * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video.
 *
 * BLOCKS
 * Audio................Specific styles for the audio block.
 * Button...............Specific styles for the button block.
 * Code.................Specific styles for the code block.
 * Columns..............Specific styles for the columns block.
 * Cover................Specific styles for the cover block.
 * File.................Specific styles for the file block.
 * Gallery..............Specific styles for the gallery block.
 * Group................Specific styles for the group block.
 * Heading..............Specific styles for the heading block.
 * Image................Specific styles for the image block.
 * Latest comments......Specific styles for the latest comments block.
 * Latest posts.........Specific styles for the latest posts block.
 * Legacy...............Specific styles for the legacy gallery.
 * List.................Specific styles for the list block.
 * Media text...........Specific styles for the media and text block.
 * Navigation...........Specific styles for the navigation block.
 * Paragraph............Specific styles for the paragraph block.
 * Pullquote............Specific styles for the pullquote block.
 * Quote................Specific styles for the quote block.
 * Search...............Specific styles for the search block.
 * Separator............Specific styles for the separator block.
 * Table................Specific styles for the table block.
 * Poetry (Verse).......Specific styles for the poetry block.
 * Video................Specific styles for the video block.
 * Utilities............Block alignments.
 *
 * COMPONENTS
 * Header...............Header styles.
 * Footer...............Footer styles.
 * Comments.............Comment styles.
 * Archives.............Archive styles.
 * 404..................404 styles.
 * Search...............Search styles.
 * Navigation...........Navigation styles.
 * Footer Navigation....Footer Navigation styles.
 * Pagination...........Pagination styles.
 * Single...............Single page and post styles.
 * Posts and pages......Misc, sticky post styles.
 * Entry................Entry, author biography.
 * Widget...............Widget styles.
 * Editor...............Editor styles.
 *
 * UTILITIES
 * A11y.................Screen reader text, prefers reduced motion etc.
 * Color Palette........Classes for the color palette colors.
 * Editor Font Sizes....Editor Font Sizes.
 * Measure..............The width of a line of text, in characters.
 */

/* Categories 01 to 03 are the basics. */

/* Variables */




h1.entry-title {
    display: none;
}



.message-box {
    height: 150px !important;
    resize: none;
}




/*===============================
    Chicci Trading Hours
================================*/

.chicci-trading-hours-section{
    padding:80px 0;
    background:#fff;
}

.chicci-hours-wrapper {
    max-width: 100%;
    margin: auto;
}

/* Tabs */

.chicci-hours-nav{
    gap:15px;
    margin-bottom:35px;
}






.chicci-hours-btn {
    background: #dfd6bb !important;
    color: #222 !important;
    border: 2px solid #e9e9e9 !important;
    border-radius: 14px !important;
    padding: 14px 40px !important;
    font-size: 16px;
    font-weight: 600;
    transition: .35s ease;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .06);
}




.chicci-hours-btn:hover{
    background:#bf112b !important;
    color:#fff !important;
    border-color:#bf112b !important;
    transform:translateY(-3px);
}

.chicci-hours-btn.active{
    background:#bf112b !important;
    color:#fff !important;
    border-color:#bf112b !important;
    box-shadow:0 12px 30px rgba(191,17,43,.25);
}

/* Table */

.chicci-hours-table-wrap{
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 20px 45px rgba(0,0,0,.08);
}

.chicci-hours-table{
    margin:0;
    border-collapse:collapse;
}

.chicci-hours-table thead{
    background:#bf112b;
}

.chicci-hours-table thead th{
    color:#fff;
    border:none;
    text-align:center;
    padding:18px;
    font-size:17px;
    font-weight:700;
    letter-spacing:.5px;
}

.chicci-hours-table tbody td {
    padding: 18px;
    text-align: center;
    font-size: 15px;
    border-bottom: 2px solid #ffffff;
}

.chicci-hours-table tbody tr:nth-child(even){
    background:#fafafa;
}

.chicci-hours-table tbody tr:hover{
    background:#fff4f5;
}

.chicci-hours-table tbody td:first-child {
    font-weight: 700;
    color: #bf112b;
    width: 35%;
    background-color: #d9d9d9;
    font-size: 16px;
}

/* Responsive */

@media (max-width:767px){

    .chicci-hours-nav{
        display:flex;
        flex-direction:column;
        gap:10px;
    }

    .chicci-hours-btn{
        width:100%;
        padding:15px !important;
    }

    .chicci-hours-table thead th{
        font-size:15px;
        padding:14px;
    }

    .chicci-hours-table tbody td{
        font-size:14px;
        padding:14px 10px;
    }

}


.mb-466 {
    margin-bottom: 50px !important;
}




.sticky-sidebar{
    position: sticky;
    top:120px;
}

.sidebar-widget{
    background:#fff;
    border:1px solid #e5e5e5;
    padding:30px;



    small {
    font-size: 14px;
    font-weight: 400;
}
    border-radius:10px;
}

.widget-title{
    font-size:



    small {
    font-size: 14px;
    font-weight: 400;
}26px;
    margin-bottom:25px;
    font-weight:700;
}

.recent-post-item{
    display:flex;
    gap:15px;
    margin-bottom:20px;
    padding-bottom:20px;
    border-bottom:1px solid #eee;
}

.recent-post-item:last-child{
    margin-bottom:0;
    padding-bottom:0;
    border:none;
}

.recent-thumb img{
    width:90px;
    height:90px;
    object-fit:cover;
    border-radius:8px;
}

.recent-content span{
    font-size:13px;
    color:#888;
    display:block;
    margin-bottom:5px;
}

.recent-content h6{
    font-size:16px;
    line-height:24px;
    margin:0;
}

.recent-content h6 a{
    color:#222;
    text-decoration:none;
}

.recent-content h6 a:hover{
    color:#d72638;
}

.blog-featured-image img{
    width:100%;
    border-radius:10px;
}

.blog-content-area img{
    max-width:100%;
    height:auto;
}

.blog-content-area{
    line-height:1.9;
}



small {
    font-size: 14px;
    font-weight: 400;
}

.banner-style {
    display: inline-block;
    background: #dc3545;
    backdrop-filter: blur(10px);
    border: 1px solid var(--white-100);
    padding: 8px 20px;
    border-radius: 20px;   margin-bottom: 20px;
}

.banner-text {
    margin: 0;
}

a.primary-btn.jkl {
    background-color: #d58f12;
    border: 1px solid #fdaf22;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: rgb(253, 175, 34);
    border-right-color: rgb(253, 175, 34);
    border-bottom-color: rgb(253, 175, 34);
    border-left-color: rgb(253, 175, 34);
    border-image-source: none;
    border-image-slice: 100%;
    border-image-width: 1;
    border-image-outset: 0;
    border-image-repeat: stretch;
}
h5.headigggg {
    font-size: 33px;
    font-weight: 500;
    font-style: italic;
    text-align: center;
}



h2.section-title-one.jkll.mb-2 {
    font-size: 50px;
    color: #bf1029;
    text-align: center;
}

/* =========================================
   HERO MAIN
========================================= */

.hero-section {
    position: relative;
    width: 100%;
    height: 750px;
    min-height: 650px;
    overflow: hidden;
}


/* =========================================
   BACKGROUND SLIDER
========================================= */

.hero-slider-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
}


/* Each Slide */

.hero-bg-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    opacity: 0;

    transition:
        opacity 1.2s ease-in-out,
        transform 6s ease;

    transform: scale(1.05);

    visibility: hidden;
}


/* Active Slide */

.hero-bg-slide.active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}


/* Image */

.hero-bg-slide img {
    width: 100%;
    height: 100%;
    display: block;

    object-fit: cover;
    object-position: center center;
}


/* =========================================
   OVERLAY
========================================= */

.hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;

    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.72) 0%,
        rgba(0, 0, 0, 0.50) 35%,
        rgba(0, 0, 0, 0.25) 65%,
        rgba(0, 0, 0, 0.10) 100%
    );
}

/* =========================================
   CONTENT
========================================= */

.banner-section {
    position: relative;

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;

    z-index: 3;
}


.banner-details {
    width: 100%;
}


.banner-content {
    position: relative;
    z-index: 5;
    text-align: center;
}



/* =========================================
   HEADING
========================================= */

.banner-content .title {
    color: #ffffff;
    margin-bottom: 20px;
}


.banner-content .banner-text {
    color: #ffffff;

    margin-bottom: 30px;
}


/* =========================================
   BUTTONS
========================================= */

.banner-btn {
    display: ;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 991px) {

    .hero-section {
        height: 650px;
        min-height: 600px;
    }

    .banner-section {
        align-items: center;
    }

    .banner-content {
        text-align: left;
    }

}


@media (max-width: 767px) {

    .hero-section {
        height: 650px;
        min-height: 600px;
    }

    .hero-bg-slide img {
        object-position: center center;
    }

    .hero-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(0, 0, 0, 0.70),
                rgba(0, 0, 0, 0.40)
            );
    }

    .banner-content .title {
        margin-bottom: 15px;
    }

    .banner-content .banner-text {
        margin-bottom: 25px;
    }

    .banner-btn {
        gap: 10px;
    }

}


@media (max-width: 575px) {

    .hero-section {
        height: 620px;
        min-height: 580px;
    }

    .banner-btn {
        flex-direction: column;
        align-items: flex-start;
    }

}


/* =========================================
   SLIDER JAVASCRIPT
========================================= */






/* =========================================
   HERO BUTTON COLORS
========================================= */

/* ORDER ONLINE - RED */
.banner-btn .hero-order-btn {
    background: linear-gradient(
        135deg,
        #e96b60 0%,
        #ea3329 40%,
        #b91c1f 100%
    );
}


/* PHONE - GREEN */
.banner-btn .hero-phone-btn {
    background: linear-gradient(
        135deg,
        #55b879 0%,
        #249653 45%,
        #08733d 100%
    );
}


/* OUR MENU - RED */
.banner-btn .hero-menu-btn {
    background: linear-gradient(
        135deg,
        #e96b60 0%,
        #ea3329 40%,
        #b91c1f 100%
    );
}


/* =========================================
   HOVER
========================================= */

.banner-btn .hero-order-btn:hover,
.banner-btn .hero-menu-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(185, 28, 31, 0.30);
}


.banner-btn .hero-phone-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(8, 115, 61, 0.30);
}




.bg-dark1 {
    background: linear-gradient(135deg, #e95b51 0%, #c82322 100%);
}



h2.jkll {
    color: #e31e1c;
}

h3.jkll {
    color: #e31e1c;
}
.breadcrumb-bar {
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

@media (max-width: 767px) {
    .breadcrumb-bar {
        background-attachment: scroll;
    }
}

/* =========================================
   NAPOLI ABOUT SECTION
========================================= */

.napoli-about-section {
    position: relative;
    padding: 100px 0;
    background: #fff;
    overflow: hidden;
}

.napoli-about-content {
    padding-right: 35px;
}

.napoli-about-subtitle {
    display: inline-block;
    margin-bottom: 12px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #971a25;
}

.napoli-about-title {
    margin: 0;
    font-size: 42px;
    line-height: 1.2;
    font-weight: 700;
    color: #242424;
}

.napoli-about-divider {
    width: 65px;
    height: 3px;
    margin: 22px 0 25px;
    background: linear-gradient(90deg, #971a25, #c58b45);
    border-radius: 10px;
}

.napoli-about-content p {
    margin-bottom: 17px;
    font-size: 16px;
    line-height: 1.8;

}

.napoli-about-intro {
    font-size: 18px !important;
    line-height: 1.7 !important;
    color: #333 !important;
    font-weight: 500;
}


/* FEATURES */

.napoli-about-features {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 28px 0;
    padding: 22px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.napoli-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 30%;
    min-width: 145px;
}

.napoli-feature-icon {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #faf3ed;
    font-size: 19px;
}

.napoli-feature h4 {
    margin: 0 0 3px;
    font-size: 14px;
    font-weight: 700;
    color: #282828;
}

.napoli-feature p {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: #888 !important;
}


/* LOCATION TEXT */

.napoli-about-location {
    color: #666;
}


/* TAGLINE */

.napoli-about-tagline {
    position: relative;
    margin-top: 25px;
    padding-left: 20px;
    border-left: 3px solid #971a25;
}

.napoli-about-tagline span {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    line-height: 1.5;
    font-style: italic;
    color: #971a25;
}


/* IMAGE */

.napoli-about-image-wrap {
    position: relative;
    padding: 0 15px 25px 25px;
}

.napoli-about-image {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.14);
}

.napoli-about-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 60%,
        rgba(0, 0, 0, 0.12)
    );
    pointer-events: none;
}

.napoli-about-image img {
    display: block;
    width: 100%;
    height: 570px;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.napoli-about-image:hover img {
    transform: scale(1.04);
}


/* DECORATIVE FRAME */

.napoli-about-image-wrap::before {
    content: "";
    position: absolute;
    top: 25px;
    left: 0;
    width: 85%;
    height: 90%;
    border: 1px solid #d7b27a;
    border-radius: 8px;
    z-index: 0;
}

.napoli-about-image {
    position: relative;
    z-index: 1;
}


/* SINCE BADGE */

.napoli-about-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2;

    width: 105px;
    height: 105px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border-radius: 50%;
    background: #971a25;
    color: #fff;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
}

.napoli-about-badge strong {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.napoli-about-badge span {
    margin-top: 2px;
    font-size: 28px;
    line-height: 1;
    font-weight: 700;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991px) {

    .napoli-about-section {
        padding: 75px 0;
    }

    .napoli-about-content {
        padding-right: 0;
    }

    .napoli-about-title {
        font-size: 36px;
    }

    .napoli-about-image-wrap {
        margin-top: 20px;
    }

    .napoli-about-image img {
        height: 500px;
    }
}


@media (max-width: 767px) {

    .napoli-about-section {
        padding: 60px 0;
    }

    .napoli-about-title {
        font-size: 30px;
    }

    .napoli-about-intro {
        font-size: 17px !important;
    }

    .napoli-about-content p {
        font-size: 15px;
        line-height: 1.7;
    }

    .napoli-about-features {
        display: block;
    }

    .napoli-feature {
        margin-bottom: 18px;
    }

    .napoli-feature:last-child {
        margin-bottom: 0;
    }

    .napoli-about-image-wrap {
        padding: 0 10px 20px 15px;
    }

    .napoli-about-image img {
        height: 400px;
    }

    .napoli-about-badge {
        width: 85px;
        height: 85px;
    }

    .napoli-about-badge span {
        font-size: 23px;
    }

    .napoli-about-tagline span {
        font-size: 18px;
    }
}


/* ============================================================
   RESTAURANT MENU STYLES — RED GRADIENT + GREEN ACCENT
   ============================================================ */

/* ================= WRAPPER ================= */




/* ================= TABS NAVIGATION ================= */
.menu-itemm-styling .nav-tabs {
  border-bottom: none;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 2rem;
  padding-bottom: 0;
  position: relative;
}

.menu-itemm-styling .nav-tabs::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #c0392b 0%, #e74c3c 50%, #27ae60 100%);
    border-radius: 3px;
    /* opacity: 0.15; */
}

.menu-itemm-styling .nav-tabs .nav-item {
  margin: 0;
}

.menu-itemm-styling .nav-tabs .nav-link {
    color: #000000 !important;
    font-weight: 500;
    font-size: 0.82rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    border: 2px solid #e52922;
    border-radius: 30px;
    padding: 0.65rem 1.35rem;
    background: #ffcfd3;
    transition: all 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.menu-itemm-styling .nav-tabs .nav-link::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #e9584d 0%, #ca2423 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
    z-index: -1;
}

.menu-itemm-styling .nav-tabs .nav-link:hover {
  color: #c0392b;
  border-color: rgba(192, 57, 43, 0.25);
  transform: translateY(-2px);
  box-shadow: 0 6px 15px rgba(192, 57, 43, 0.15);
}

.menu-itemm-styling .nav-tabs .nav-link.active {
  color: #fff;
  background: transparent;
  border-color: transparent;
  font-weight: 600;
  box-shadow: 0 8px 20px rgba(192, 57, 43, 0.35);
  transform: translateY(-2px);
}

.menu-itemm-styling .nav-tabs .nav-link.active::before {
  opacity: 1;
}

/* Green underline dot on active tab */
.menu-itemm-styling .nav-tabs .nav-link.active::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 8px;
  height: 8px;
  background: #27ae60;
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(39, 174, 96, 0.2);
}

/* ================= TAB CONTENT ================= */
.menu-itemm-styling .tab-content {
  background: #fff;
  border-radius: 12px;
  padding: 0.5rem 0;
  animation: fadeInMenu 0.4s ease;
}

@keyframes fadeInMenu {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ================= MENU TABLE ================= */
.menu-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}

.menu-table tbody tr {
  transition: background 0.3s ease;
  border-radius: 8px;
}

.menu-table tbody tr:hover {
  background: linear-gradient(90deg, rgba(192, 57, 43, 0.035) 0%, rgba(39, 174, 96, 0.035) 100%);
}

.menu-table td {
  padding: 1rem 0.75rem;
  vertical-align: top;
  border-bottom: 1px dashed #e9ecef;
}

.menu-table tbody tr:last-child td {
  border-bottom: none;
}

.menu-table td.price-cell {
  width: 95px;
  text-align: right;
  white-space: nowrap;
}

/* ================= MENU TITLE ================= */
.menu-table h3.menu-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 24px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 0.4rem 0;
    letter-spacing: 0.3px;
    line-height: 1.35;
    position: relative;
    padding-left: 14px;
}

/* Red gradient vertical bar next to title */
.menu-table h3.menu-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  background: linear-gradient(180deg, #c0392b 0%, #e74c3c 70%, #27ae60 100%);
  border-radius: 4px;
}

.menu-table h3.menu-title .extras {
  font-family: 'Poppins', sans-serif;
  font-size: 0.78rem;
  font-weight: 400;
  font-style: italic;
  color: #27ae60;
  margin-left: 0.35rem;
  letter-spacing: 0;
}

.menu-table h3.menu-price {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 28px;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
    background: linear-gradient(135deg, #e72822 0%, #c01618 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #c0392b;
    display: inline-block;
    padding-top: 2px;
}

/* ================= DESCRIPTION ================= */


/* ================= CATEGORY NOTE ================= */
.menu-note {
    background: linear-gradient(135deg, #fdf2f2 0%, #f0faf4 100%);
    border-left: 4px solid;
    border-image: linear-gradient(180deg, #c0392b 0%, #27ae60 100%) 1;
    padding: 0.9rem 1.15rem;
    border-radius: 8px;
    /* font-size: 0.85rem; */
    color: #000000;
    margin-bottom: 1.25rem;
    line-height: 1.6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.menu-note .highlight {
  color: #c0392b;
  font-weight: 600;
  background: rgba(192, 57, 43, 0.08);
  padding: 1px 6px;
  border-radius: 4px;
}

/* ================= TAB FADE ANIMATION ================= */
.menu-itemm-styling .tab-pane {
  animation: none;
}

.menu-itemm-styling .tab-pane.active {
  animation: tabSlideIn 0.45s cubic-bezier(0.25, 0.8, 0.25, 1);
}

@keyframes tabSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ================= RESPONSIVE ================= */
@media (max-width: 991.98px) {
  .menu-itemm-styling {
    padding: 1.25rem 1rem;
    border-radius: 12px;
  }
  .menu-itemm-styling .nav-tabs .nav-link {
    font-size: 0.78rem;
    padding: 0.55rem 1.1rem;
  }
}

@media (max-width: 767.98px) {
  .menu-itemm-styling .nav-tabs {
    gap: 0.4rem;
  }
  .menu-itemm-styling .nav-tabs .nav-link {
    font-size: 0.72rem;
    padding: 0.5rem 0.9rem;
    letter-spacing: 0.5px;
  }
  .menu-table h3.menu-title {
    font-size: 1rem;
  }
  .menu-table h3.menu-price {
    font-size: 1.05rem;
  }
  .menu-table p.menu-desc {
    font-size: 0.83rem;
  }
}

@media (max-width: 575.98px) {
  .menu-itemm-styling {
    padding: 1rem 0.75rem;
  }
  .menu-itemm-styling .nav-tabs .nav-link {
    font-size: 0.68rem;
    padding: 0.45rem 0.75rem;
  }
  .menu-table td {
    padding: 0.8rem 0.4rem;
  }
  .menu-table td.price-cell {
    width: 70px;
  }
  .menu-table h3.menu-title {
    font-size: 0.95rem;
    padding-left: 12px;
  }
  .menu-table h3.menu-title::before {
    width: 3px;
  }
  .menu-table h3.menu-price {
    font-size: 0.98rem;
  }
  .menu-table p.menu-desc {
    font-size: 0.78rem;
  }
  .menu-note {
    font-size: 0.78rem;
    padding: 0.75rem 0.9rem;
  }
}



.lietttttt {
    list-style: none;
    padding: 0;
    margin: 25px 0 0;
}

.lietttttt li {
    position: relative;
    padding-left: 48px;
    margin-bottom: 12px;
    /* font-size: 14px; */
    /* line-height: 1.7; */
    /* color: #666; */
}

.lietttttt li::before {
    content: "\f058";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 0px;
    color: #db2d26;
    font-size: 20px;
}