/*
Theme Name: Drogami Pokoju
Theme URI: https://arcusgroup.home.pl/drogamipokoju/
Author: Drogami Pokoju
Description: Responsywny motyw z pięcioma banerami i eleganckim menu.
Version: 1.4.1
Text Domain: drogami-pokoju
*/

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

/* Nagłówek i logo */
.site-header {
    position: relative;
    z-index: 100;
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #c8dbe6;
    box-shadow: 0 3px 15px rgba(30,65,90,.05);
}
.header-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 12px 35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.site-logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.site-logo img {
    display: block;
    width: auto;
    height: auto;
    max-width: 230px;
    max-height: 90px;
    object-fit: contain;
}

/* Menu główne */
.site-nav { margin-left: auto; }
.site-nav ul {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 38px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-nav li { position: relative; }
.site-nav a {
    position: relative;
    display: inline-block;
    padding: 12px 0;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #304c62;
    text-decoration: none;
    transition: color .3s ease;
}
.site-nav a::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 50%;
    width: 0;
    height: 1px;
    background: #267db3;
    transform: translateX(-50%);
    transition: width .35s ease;
}
.site-nav a:hover,
.site-nav a:focus-visible,
.site-nav .current-menu-item > a,
.site-nav .current_page_item > a,
.site-nav .current-menu-ancestor > a { color: #1676b4; }
.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav .current-menu-item > a::after,
.site-nav .current_page_item > a::after,
.site-nav .current-menu-ancestor > a::after { width: 100%; }
.menu-toggle {
    display: none;
    border: 0;
    background: transparent;
    color: #267db3;
    font-size: 30px;
    line-height: 1;
    padding: 8px;
    cursor: pointer;
}

/* NAPRAWA SLIDERA */

.hero {
    position: relative;
    width: 100%;
    height: clamp(200px, 65vw, 500px);
    overflow: hidden;
    background: #183e64;
}

.hero .slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;

    opacity: 0;
    visibility: hidden;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    transition: opacity 1.2s ease, visibility 1.2s ease;
}

.hero .slide.active {
    opacity: 1;
    visibility: visible;
    z-index: 1;
}

/* NAPISY */

.hero .slide-content {
    position: relative;
    z-index: 2;
    width: 42%;
    margin-right: 6%;
    padding: 25px;
    text-align: right;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 12px;
}

.hero .slide-content h2 {
    color: #ffffff;
    font-size: clamp(24px, 2.5vw, 46px);
    margin: 0 0 15px;
    line-height: 1.2;
}

.hero .slide-content p {
    color: #ffffff;
    font-size: clamp(14px, 1.2vw, 21px);
    margin: 0;
}

/* KROPKI SLIDERA */

.hero .dots {
    position: absolute;
    z-index: 5;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
}

.hero .dot {
    width: 13px;
    height: 13px;
    border: 2px solid white;
    border-radius: 50%;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.hero .dot.active {
    background: white;
}

/* TELEFON */

@media (max-width: 768px) {

    .hero {
        height: auto !important;
        aspect-ratio: 3 / 1;
        min-height: 0 !important;
    }

    .hero .slide {
        background-size: contain !important;
        background-position: center !important;
    }

    .hero .slide-content {
        width: 52%;
        margin-right: 3%;
        padding: 6px 8px;
        border-radius: 5px;
    }

    .hero .slide-content h2 {
        font-size: clamp(9px, 2.5vw, 15px);
        margin-bottom: 3px;
    }

    .hero .slide-content p {
        font-size: clamp(7px, 1.8vw, 11px);
        line-height: 1.2;
    }

    .hero .dots {
        bottom: 5px;
        gap: 7px;
    }

    .hero .dot {
        width: 8px;
        height: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero .slide {
        transition: none;
    }
}


/* ETAP 3: AKTUALNOŚCI */
.news-section { padding: 75px 24px 90px; background: #f8fafb; }
.news-container { max-width: 1400px; margin: 0 auto; }
.news-heading { text-align: center; margin: 0 auto 38px; }
.news-eyebrow { color: #3181aa; font: 600 11px/1.4 Arial,sans-serif; letter-spacing: 2.5px; }
.news-heading h2 { font: 400 clamp(30px,3vw,44px)/1.2 Georgia,serif; color: #26465d; margin: 12px 0; }
.news-heading p { color: #6b7e8a; font: 15px/1.6 Arial,sans-serif; margin: 0; }
.news-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; }
.news-card { background: #fff; border: 1px solid #e5edf1; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 25px rgba(32,68,91,.055); transition: transform .25s ease,box-shadow .25s ease; }
.news-card:hover { transform: translateY(-5px); box-shadow: 0 14px 35px rgba(32,68,91,.13); }
.news-card-image { display: block; aspect-ratio: 4/3; overflow: hidden; background: #e4eff5; }
.news-card-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .35s ease; }
.news-card:hover .news-card-image img { transform: scale(1.045); }
.news-image-placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: #75a9c4; font-size: 65px; }
.news-card-body { padding: 24px 22px 26px; }
.news-card time { font: 12px Arial,sans-serif; color: #3987af; }
.news-card h3 { margin: 12px 0; font: 600 20px/1.35 Georgia,serif; }
.news-card h3 a { color: #29475c; text-decoration: none; }
.news-card h3 a:hover { color: #1676b4; }
.news-card p { font: 14px/1.7 Arial,sans-serif; color: #6d7b85; margin: 0 0 22px; }
.news-more { color: #1978ab; font: 600 13px Arial,sans-serif; text-decoration: none; }
.news-more:hover { text-decoration: underline; }
.news-empty { grid-column: 1/-1; text-align: center; color: #687d89; font: 16px Arial,sans-serif; }
@media (max-width: 1050px) { .news-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .news-section { padding: 48px 18px 60px; } .news-grid { grid-template-columns: 1fr; gap: 20px; } }
@media (prefers-reduced-motion: reduce) { .news-card,.news-card-image img { transition: none; } }

/* Menu mobilne: uzupełnienie brakujących reguł */
@media (max-width: 1100px) {
 .site-header .header-inner { flex-wrap: wrap; gap: 12px; padding: 12px 20px; }
 .site-header .site-logo img { max-width: 170px; max-height: 70px; }
 .site-header .menu-toggle { display: block; margin-left: auto; }
 .site-header .site-nav { display: none; width: 100%; flex-basis: 100%; margin: 0; }
 .site-header .site-nav.open { display: block; }
 .site-header .site-nav ul { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
 .site-header .site-nav li { width: 100%; }
 .site-header .site-nav a { display: block; padding: 14px 12px; white-space: normal; }
 .site-header .site-nav a::after { display: none; }
}
@media (min-width: 1101px) {
 .site-header .site-nav li { white-space: nowrap; }
 .site-header .site-nav ul { gap: clamp(10px,1.4vw,24px); }
 .site-header .site-nav a { font-family: Arial,sans-serif; font-size: 12px; font-weight: 500; letter-spacing: .4px; }
}

/* Pojedyncza aktualność */
.single-main { background: #f8fafb; min-height: 65vh; padding: 65px 20px 90px; }
.single-article { max-width: 920px; margin: 0 auto; background: #fff; border: 1px solid #e5edf1; border-radius: 14px; overflow: hidden; box-shadow: 0 8px 30px rgba(32,68,91,.06); }
.single-top { padding: 45px 55px 30px; }
.single-back { display: inline-block; color: #1978ab; font: 600 14px/1.5 Arial,sans-serif; text-decoration: none; }
.single-back:hover { text-decoration: underline; }
.single-meta { margin-top: 28px; font: 13px/1.5 Arial,sans-serif; color: #3987af; }
.single-top h1 { margin: 12px 0 0; font: 500 clamp(30px,4vw,48px)/1.2 Georgia,serif; color: #26465d; overflow-wrap: anywhere; }
.single-image { margin: 0; }
.single-image img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: cover; }
.single-content { padding: 35px 55px 50px; color: #344e60; font: 17px/1.85 Arial,sans-serif; overflow-wrap: anywhere; }
.single-content p { margin: 0 0 1.35em; }
.single-content img { max-width: 100%; height: auto; }
.single-content a { color: #1978ab; }
.single-bottom { border-top: 1px solid #e5edf1; padding: 25px 55px 35px; }
@media (max-width: 600px) {
 .single-main { padding: 25px 12px 55px; }
 .single-top { padding: 28px 22px 20px; }
 .single-content { padding: 24px 22px 35px; font-size: 16px; }
 .single-bottom { padding: 20px 22px 25px; }
}

/* Etap 4: paginacja aktualności */
.news-pagination { margin: 38px auto 0; display: flex; justify-content: center; }
.news-pagination .page-numbers { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 9px; list-style: none; padding: 0; margin: 0; }
.news-pagination .page-numbers li { margin: 0; padding: 0; }
.news-pagination a.page-numbers,
.news-pagination span.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; min-height: 42px; padding: 9px 13px; border: 1px solid #d9e6ed; border-radius: 9px; background: #fff; color: #275575; font: 600 14px/1.3 Arial,sans-serif; text-decoration: none; transition: background .2s ease, color .2s ease; }
.news-pagination a.page-numbers:hover,
.news-pagination a.page-numbers:focus-visible { background: #eaf4f9; border-color: #91bdd3; }
.news-pagination span.page-numbers.current { background: #1978ab; border-color: #1978ab; color: #fff; }
.news-pagination span.page-numbers.dots { position: static; transform: none; display: inline-flex; color: #6d7b85; }
@media (max-width: 600px) { .news-pagination { margin-top: 28px; } .news-pagination .page-numbers { gap: 5px; } .news-pagination a.page-numbers, .news-pagination span.page-numbers { min-width: 35px; min-height: 38px; padding: 7px 9px; font-size: 12px; } }

/* Stopka Drogami Pokoju */
.dp-footer { background:#173f61; color:#e4f0f7; }
.dp-footer-inner { max-width:1400px; margin:auto; padding:60px 30px 45px; display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:55px; }
.dp-footer-brand img { display:block; width:180px; max-width:100%; height:auto; background:#fff; padding:10px; border-radius:8px; }
.dp-footer-brand p { margin:18px 0 0; color:#c5d8e6; font:15px/1.6 Arial,sans-serif; }
.dp-footer-column { display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.dp-footer-column h2 { margin:0 0 10px; color:#fff; font:600 19px/1.4 Arial,sans-serif; }
.dp-footer-column p { margin:0; color:#c5d8e6; font:14px/1.7 Arial,sans-serif; }
.dp-footer-column a { color:#e4f0f7; text-decoration:none; font:14px/1.6 Arial,sans-serif; }
.dp-footer-column a:hover,.dp-footer-column a:focus-visible { color:#9cddff; text-decoration:underline; }
.dp-footer-bottom { border-top:1px solid rgba(255,255,255,.18); padding:20px 24px; text-align:center; color:#c5d8e6; font:13px/1.6 Arial,sans-serif; }
@media (max-width:768px) { .dp-footer-inner { grid-template-columns:1fr; gap:30px; padding:42px 22px 35px; } .dp-footer-brand img { width:150px; } .dp-footer-bottom { font-size:12px; } }

/* Logo na komputerze */
.site-header .site-logo img {
    display: block;
    width: 216px;
    max-width: none;
    max-height: none;
    height: auto;
}

/* Logo na tablecie i telefonie */
@media (max-width: 1100px) {
    .site-header .site-logo img {
        width: 160px;
        max-width: 100%;
        max-height: none;
        height: auto;
    }
}

/* Aktualności: pełna fotografia na rozmytym tle z tej samej miniatury */
.news-card-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #e4eff5;
}

.news-card-image::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -18px;
    background-image: var(--news-image, none);
    background-size: cover;
    background-position: center;
    filter: blur(15px) brightness(.85);
    transform: scale(1.08);
    pointer-events: none;
}

.news-card-image img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transition: none;
}

/* Nie powiększamy zdjęcia, aby nie ucinać twarzy ani napisów. */
.news-card:hover .news-card-image img {
    transform: none;
}

.news-image-placeholder {
    position: relative;
    z-index: 1;
}
/* Pojedynczy wpis – pełne zdjęcie bez przycinania */
.single-image {
    margin: 0;
    padding: 25px;
    background: #f5f8fa;
    text-align: center;
}

.single-image img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 750px;
    object-fit: contain;
    margin: 0 auto;
}

/* Telefon */
@media (max-width: 768px) {
    .single-image {
        padding: 12px;
    }

    .single-image img {
        max-height: none;
    }
}
.news-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 35%;
}
/* Archiwa kategorii – wspólny wygląd kafelków */
.category-section { min-height: 65vh; }
.category-section .news-heading h1 { font: 400 clamp(30px,3vw,44px)/1.2 Georgia,serif; color:#26465d; margin:12px 0; }
.category-description { color:#6b7e8a; font:15px/1.6 Arial,sans-serif; }
.category-description p { margin:0; }

/* Pasek kontaktowy – wklej na sam koniec aktywnego style.css */
.dp-contact-strip { background: #fff; border-bottom: 1px solid #e4edf1; box-shadow: 0 5px 22px rgba(32,68,91,.055); position: relative; z-index: 2; }
.dp-contact-strip-inner { max-width: 1400px; margin: 0 auto; padding: 24px 30px; display: grid; grid-template-columns: 1fr 1fr 1.45fr; gap: 25px; }
.dp-contact-item { display: flex; align-items: center; gap: 15px; min-width: 0; color: #29475c; text-decoration: none; }
.dp-contact-item + .dp-contact-item { border-left: 1px solid #e5edf1; padding-left: 30px; }
.dp-contact-icon { width: 49px; height: 49px; flex: 0 0 49px; display: grid; place-items: center; color: #b9821f; background: #fff7e8; border-radius: 50%; }
.dp-contact-icon svg { width: 24px; height: 24px; }
.dp-contact-label { display: block; color: #9a6b1c; font: 700 11px/1.5 Arial,sans-serif; letter-spacing: 1.3px; text-transform: uppercase; margin-bottom: 4px; }
.dp-contact-value { display: block; color: #29475c; font: 500 15px/1.5 Arial,sans-serif; overflow-wrap: anywhere; }
a.dp-contact-item:hover .dp-contact-value { color: #1676b4; text-decoration: underline; }
@media (max-width: 900px) { .dp-contact-strip-inner { grid-template-columns: 1fr; gap: 18px; padding: 24px 22px; } .dp-contact-item + .dp-contact-item { border-left: 0; border-top: 1px solid #e5edf1; padding: 18px 0 0; } }

/* Sekcja wsparcia fundacji – pod galerią */
.dp-donation-section{padding:55px 22px 90px;background:#f8fafb}
.dp-donation-card{max-width:1120px;margin:auto;padding:55px 55px 45px;border:1px solid #d9e5e9;border-top:5px solid #c18a2c;border-radius:20px;background:#fff;box-shadow:0 16px 45px rgba(26,66,87,.09);text-align:center}
.dp-donation-symbol{width:64px;height:64px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;background:#fff7e9;color:#bd8220;font:52px/1 Georgia,serif}
.dp-donation-eyebrow{font:700 11px/1.4 Arial,sans-serif;letter-spacing:2.5px;color:#b47c21}
.dp-donation-card h2{font:400 clamp(30px,3.5vw,45px)/1.2 Georgia,serif;color:#26465d;margin:12px 0 16px}
.dp-donation-intro{max-width:700px;margin:0 auto 32px;color:#647986;font:16px/1.75 Arial,sans-serif}
.dp-donation-amounts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 34px}
.dp-donation-amount{padding:24px 10px;border:1px solid #e6d4b4;border-radius:12px;background:linear-gradient(180deg,#fffdf9,#fff7e9)}
.dp-donation-amount span{display:block;color:#7b6b54;font:13px Arial,sans-serif;margin-bottom:8px}
.dp-donation-amount strong{display:block;color:#9c6818;font:700 clamp(20px,2vw,27px)/1.25 Georgia,serif}
.dp-donation-amount small{font-size:.58em}
.dp-donation-bank{padding:25px 24px;border:1px solid #dce9ef;border-radius:13px;background:#f3f8fb}
.dp-donation-bank-label{display:block;color:#4c6d80;font:600 13px Arial,sans-serif;margin-bottom:13px}
.dp-donation-bank-row{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.dp-donation-account{color:#244a65;font:600 clamp(15px,2vw,22px)/1.5 Arial,sans-serif;letter-spacing:1px;overflow-wrap:anywhere}
.dp-donation-copy{border:0;border-radius:8px;padding:12px 19px;background:#bd8425;color:#fff;font:600 13px Arial,sans-serif;cursor:pointer}
.dp-donation-copy:hover:not(:disabled){background:#9c6818}
.dp-donation-copy:disabled{opacity:.55;cursor:not-allowed}
.dp-donation-transfer{color:#607786;font:13px/1.6 Arial,sans-serif;margin:17px 0 0}
.dp-donation-copy-status{display:block;min-height:1.4em;margin-top:8px;color:#276d52;font:13px Arial,sans-serif}
.dp-donation-note{margin:25px 0 0;color:#7a6b55;font:italic 16px/1.5 Georgia,serif}
@media(max-width:850px){.dp-donation-amounts{grid-template-columns:repeat(2,minmax(0,1fr))}.dp-donation-card{padding:38px 25px}}
@media(max-width:480px){.dp-donation-section{padding:35px 12px 60px}.dp-donation-card{padding:30px 14px}.dp-donation-amounts{gap:10px}.dp-donation-amount{padding:18px 6px}.dp-donation-bank{padding:20px 12px}.dp-donation-account{letter-spacing:0}}

/* WYDARZENIA: siatka pełnych plakatów, bez kadrowania */
.dp-events-main { background: #f8fafb; min-height: 65vh; }
.dp-events-section { padding: 70px 22px 90px; }
.dp-events-container { max-width: 1400px; margin: 0 auto; }
.dp-events-heading { margin-bottom: 42px; }
.dp-events-heading h1 { font: 400 clamp(32px,3.2vw,46px)/1.2 Georgia,serif; color: #26465d; margin: 12px 0; }
.dp-events-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 26px; align-items: start; }
.dp-events-card { min-width: 0; }
.dp-events-poster { display: block; background: #fff; border: 1px solid #e5edf1; border-radius: 12px; padding: 8px; box-shadow: 0 8px 25px rgba(32,68,91,.08); overflow: hidden; text-decoration: none; transition: transform .2s ease,box-shadow .2s ease; }
.dp-events-poster:hover, .dp-events-poster:focus-visible { transform: translateY(-5px); box-shadow: 0 14px 32px rgba(32,68,91,.15); }
.dp-events-poster:focus-visible { outline: 3px solid #c18b31; outline-offset: 3px; }
.dp-events-poster img.dp-events-poster-img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; object-position: center; transform: none; }
.dp-events-placeholder { display: grid; place-items: center; min-height: 300px; padding: 22px; text-align: center; color: #59788c; font: 17px/1.5 Georgia,serif; }
.dp-events-empty { text-align: center; color: #59788c; font: 16px/1.7 Arial,sans-serif; }
@media (max-width: 1050px) { .dp-events-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 600px) { .dp-events-section { padding: 44px 16px 60px; } .dp-events-grid { grid-template-columns: 1fr; gap: 22px; } }
@media (prefers-reduced-motion: reduce) { .dp-events-poster { transition: none; } }

/* Wyśrodkowanie plakatów – Już niebawem */
.dp-upcoming-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
}

/* Poprawki mobilne iPhone / Safari – 29.10.2026 */
.dp-contact-icon svg {display:block!important;width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important;flex:none!important;}
.dp-contact-icon {width:49px!important;height:49px!important;flex:0 0 49px!important;}
@media (max-width:1100px) {
 .site-header .header-inner {display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;}
 .site-header .site-logo {min-width:0;}
 .site-header .site-logo img {width:160px;max-width:100%;height:auto;}
 .site-header .menu-toggle {display:block!important;margin-left:auto;flex:0 0 auto;cursor:pointer;}
 .site-header .site-nav {display:none!important;position:absolute;top:100%;left:0;right:0;width:100%;margin:0;background:#fff;padding:12px 20px;box-shadow:0 12px 20px rgba(0,0,0,.09);z-index:110;}
 .site-header .site-nav.open {display:block!important;}
 .site-header .site-nav ul {display:flex;flex-direction:column;align-items:stretch;gap:0;}
 .site-header .site-nav li {width:100%;}
 .site-header .site-nav a {display:block;padding:13px 10px;font-size:14px;}
}
@media (max-width:600px) {
 .dp-events-section {padding:35px 14px 55px;}
 .dp-events-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 .dp-events-poster {padding:5px;border-radius:8px;}
 .dp-events-card .dp-event-signup {font-size:12px;padding:10px 6px;}
 .dp-events-heading {margin-bottom:24px;}
 .dp-events-heading h1 {font-size:30px;}
 .dp-contact-strip-inner {padding:16px 18px;gap:12px;}
 .dp-contact-item + .dp-contact-item {padding-top:12px;}
 .dp-contact-value {font-size:14px;}
}

.dp-donation-amount:last-child {
    grid-column: 1 / -1;
    justify-self: center;
    text-align: center;
    
}
/* Pomarańczowa ramka terminarza Mszy Świętych */

.dp-cal {
    border: 2px solid #777470 !important;
    border-radius: 18px !important;
    padding: 25px !important;
    background: #ffffff !important;
    box-shadow: 0 5px 20px rgba(255, 102, 0, 0.08);
    box-sizing: border-box !important;
}

@media (max-width: 600px) {
    .dp-cal {
        padding: 10px !important;
        border-radius: 12px !important;
    }
}