/* ===== Town Theme ===== */
@import url("//fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap");

:root {
  --color-primary: #092ea6;     /* strong urban blue */
  --color-primary-light: #3b82f6;
  --color-secondary: #bfdbfe;

  --color-bg: #f8fafc;          /* neutral light bg */
  --color-card: #ffffff;
  --color-border: #e2e8f0;

  --color-text: #061d52;
  --color-muted: #3f5066;

  --radius: 12px;
  --transition: 0.25s ease;
}

/* Common UI */
body {
  background-color: #f3f4f6;
  background-image: radial-gradient(#d1d5db 0.5px, transparent 0.5px);
  background-size: 24px 24px;   /* Subtle realistic texture */
  color: var(--color-text);
  font-family:'DM Sans', sans-serif;
}


.card {
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  padding: 16px;
  transition: var(--transition);
}

.card:hover {
  transform: translateY(-3px);
}

.btn-primary {
  background: var(--color-primary);
  color: #fff;
  padding: 10px 16px;
  border-radius: var(--radius);
  font-weight: 600;
}

.badge {
  background: var(--color-secondary);
  color: var(--color-primary);
  font-weight: 500;
}


/* villages search modal  */

#locationModal .overflow-hidden .p-8 {
  border-radius: 24px;
}

/* Overflow hidden */
#locationModal .overflow-hidden {
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 32px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  background: white;
}


/* Header */
header{
 padding-top:0px !important;
 padding-bottom:1px !important;
}

/* Items center */
.border-b .mx-auto .items-center > .items-center .items-center{
 margin-bottom:9px;
 padding-top:2px;
}

/* Paragraph */
.grid .space-y-6 .hover\:shadow-md .text-justify p{
 font-size:14px;
}

/* Paragraph */
.mx-auto .space-y-2 p{
 font-size:14px;
}

/* Column 6/12 */
header .mx-auto > .items-center > .items-center{
 padding-top:16px;
}

/* Image */
header div img{
 height:60px !important;
}

/* Font bold */
.items-center .lg\:col-span-3 .shadow-sm .grid div .font-bold{
 font-size:18px;
 color:#4f16d4;
}

/* Font medium */
header .lg\:col-span-3 .font-medium{
 font-size:14px;
}

/* Font bold */
.lg\:col-span-3 .shadow-sm .grid .border-t .font-bold{
 font-size:14px !important;
}

/* Items center */
.mx-auto .grid .space-y-6 .hover\:shadow-md > .items-center{
 margin-bottom:24px;
}


/* Font medium */
.lg\:col-span-3 .shadow-sm .grid .border-t .font-medium{
 display:flex;
 justify-content:normal;
 align-items:center;
}


/* Font medium */
.mx-auto .divide-y .font-medium{
 display:flex;
 align-items:center;
}

/* Drop shadow */
header .grid .drop-shadow-sm{
 color:#887b7b;
}

/* Drop shadow */
.mx-auto .divide-y .drop-shadow-sm{
 color:#776e6e;
}

sup {
    position: static !important;
    z-index: auto !important;
}
/* Leading tight */
.items-center .items-center div .inline-block .hover\:shadow-xl .items-start .leading-tight{
 font-size:12px;
 flex-direction:row;
}

/* Tracking widest */
.items-center .items-center div .inline-block .hover\:shadow-xl .items-start .tracking-widest{
 font-size:13px;
 font-weight:700;
}

/* Hover */
.items-center .items-center div .inline-block .hover\:shadow-xl{
 padding-right:5px;
 padding-left:5px;
 padding-top:5px;
 padding-bottom:5px;
}

/* Items start */
.items-center .items-center div .inline-block .hover\:shadow-xl .items-start{
 margin-right:6px;
}

/* Tracking widest */
.group\/ai .items-start .tracking-widest{
 font-size:14px;
}

/* Leading tight */
.group\/ai .items-start .leading-tight{
 font-size:16px;
}

/* Hover */
.items-center .items-center div .inline-block .hover\:shadow-xl{
 height:90px;
}

/* Group/ai */
header .mx-auto .group\/ai{
 height:90px;
}

/* Leading tight */
.group\/ai .items-start .leading-tight{
 font-size:13px;
}

/* Tracking widest */
.items-center .items-center div .inline-block .hover\:shadow-xl .items-start .tracking-widest{
 font-size:14px;
}

/* Heading */
.md\:text-left .space-y-4 h4{
 border-bottom-color:#3037f1;
}

/* Heading */
.md\:text-left .space-y-6 h4{
 border-bottom-color:#4362ee;
}

/* Font bold */
.md\:text-left .text-sm .font-bold{
 color:#020202;
}

/* Font Icon */
.max-w-xs .backdrop-blur-sm .fa-facebook{
 color:#1567da;
}

/* Font Icon */
.max-w-xs .backdrop-blur-sm .fa-instagram{
 color:#f60d4f;
}

/* Font Icon */
.max-w-xs .backdrop-blur-sm .fa-linkedin{
 color:#1271f6;
}

/* Leading relaxed */
.md\:text-left .space-y-4 .leading-relaxed{
 font-weight:600;
 font-size:13px;
}

/* Font medium */
.container .font-medium{
 color:#020202;
}

/* Image */
.items-center .items-center > .items-center div img{
 height:57px !important;
}

@media (max-width:576px){

 /* Items center */
 header .mx-auto .items-center > .items-center > .items-center{
  justify-content:center;
  /* transform:translatex(0px) translatey(0px); */
 }

 /* Column 3/12 */
 header .mx-auto > .items-center > .items-center{
  justify-content:center;
 }

 /* Heading */
 header div h1{
  text-align:left;
  /* transform:translatex(0px) translatey(0px); */
  font-size:30px !important;
 }

 /* Image */
 .items-center .items-center > .items-center div img{
  height:56px !important;
 }

}
@media (max-width:576px){

 /* Column 3/12 */
 header .mx-auto > .items-center > .items-center{
  padding-top:5px;
  /* transform:translatex(0px) translatey(0px); */
 }

 /* Column 3/12 */
 header .mx-auto > .items-center:nth-child(1) > .items-center:nth-child(1){
  display:grid;
  grid-template-columns:50% 50%;
  align-content:center;
 }

 /* Group/ai */
 header .mx-auto .group\/ai{
  width:100%;
 }

}
@media (max-width:576px){

 /* Inline block */
 header .mx-auto .items-center .items-center div .inline-block{
  width:100% !important;
 }

 /* Hover */
 .items-center .items-center div .inline-block .hover\:shadow-xl{
  width:100%;
  height:50px;
 }

 /* Column 3/12 */
 header .mx-auto > .items-center > .items-center{
  padding-left:6px;
  padding-right:6px;
  /* transform:translatex(0px) translatey(0px); */
 }



 /* Group/ai */
 header .mx-auto .group\/ai{
  height:50px;
 }

 /* Paragraph */
 header .items-center .items-center p{
  font-size:14px;
 }

 /* Heading */
 header div h1{
  font-size:32px !important;
 }

}
@media (max-width:576px){

 /* Tracking widest */
 .items-center .items-center div .inline-block .hover\:shadow-xl .items-start .tracking-widest{
  font-size:12px;
 }

 /* Tracking widest */
 .group\/ai .items-start .tracking-widest{
  font-size:12px;
 }

}
/* Image */
.items-center .items-center > .items-center div img{
 width:83px;
}

@media (min-width:577px){

 /* Image */
 .items-center .items-center > .items-center div img{
  height:80px !important;
 }

}
/* Text white */
header .mx-auto .text-white{
 background-color:rgba(31,29,29,0.58);
}

/* Image */
.justify-center > img{
 width:100px;
 min-height:100px;
}

/* Image */
header .mx-auto .items-center .items-center .justify-center > img{
 height:150px !important;
}

/* Group/ai */
header .mx-auto .group\/ai{
 min-height:50px;
 max-height:50px;
}

/* Transition opacity */
header div .transition-opacity{
 height:50px;
 min-height:50px;
 max-height:50px;
}

/* Hover */
header div .hover\:shadow-xl{
 max-height:50px;
}

@media (min-width:577px){

 /* Group/ai */
 header .mx-auto .group\/ai{
  height:50px;
 }

}
/* Paragraph */
header .items-center .items-center p{
 background-color:rgba(31,29,29,0);
}


/* Justify between */
.ml-auto .justify-between{
 font-size:14px;
}

/* Button */
.ml-auto .justify-center a{
 font-size:15px;
 background-color:#eedb4d;
}



/* Auto */
header .mx-auto .ml-auto{
 margin-left:2px;
 width:100%;
}

/* Shadow */
header .mx-auto .shadow-lg{
 background-color:rgba(2,2,2,0.78);
}

/* Realtime clock */
#realtime-clock{
 text-align:center;
}

/* Flex */
.mx-auto .grid .lg\:col-span-6 .hover\:shadow-md > .flex{
 margin-bottom:0px;
}

/* Font extrabold */
.mx-auto .relative .font-extrabold{
 font-size:25px;
 margin-bottom:0px;
}

/* Overflow hidden */
.lg\:col-span-6 .hover\:shadow-md .bg-white .grid .overflow-hidden{
 padding-right:11px;
 padding-left:10px;
 padding-bottom:0px;
 padding-top:14px;
}

/* Paragraph */
.mx-auto .relative p{
 font-size:12px;
}

/* Absolute */
.mx-auto .lg\:col-span-6 .absolute .absolute{
 visibility:hidden;
}

/* Span Tag */
.mx-auto .grid .md\:text-lg{
 font-size:14px;
}

/* Link (hover) */
.mx-auto .relative a:hover{
 box-shadow:0px 0px 13px 1px #d1d1d6 !important;
}

/* Relative */
.mx-auto .lg\:col-span-6 .overflow-hidden .relative{
 padding-left:8px;
 padding-right:9px;
 padding-top:5px;
}

/* Relative */
.mx-auto .lg\:col-span-6 .overflow-hidden .relative{
 border-top-left-radius:9px;
 border-top-right-radius:9px;
}

/* Overflow hidden */
.mx-auto .lg\:col-span-6 .grid .overflow-hidden{
 border-top-left-radius:9px;
 border-top-right-radius:9px;
 border-bottom-right-radius:9px;
 border-bottom-left-radius:9px;
}

/* White */
.mx-auto .grid .lg\:col-span-6 > .bg-white{
 border-top-left-radius:9px;
 border-top-right-radius:9px;
 border-bottom-left-radius:9px;
 border-bottom-right-radius:9px;
}

/* BackUnknown blur */
.backdrop-blur-sm{
 background-color:rgba(203,194,194,0.7);

}

/* Overflow hidden */
.backdrop-blur-sm .overflow-hidden{
 max-height:90vh;

}

/* Overflow auto */
.backdrop-blur-sm .overflow-hidden .overflow-y-auto{
 max-height:80vh;
 overflow-y:scroll;
}

/* Hover */
.backdrop-blur-sm .justify-center .hover\:bg-black{
 background-color:#000000;
}

.mx-auto .lg\:col-span-6 .items-center:nth-child(3){
 margin-top:19px;
}

/* Link */
.mx-auto .relative .space-y-4 a{
 background-color:rgba(203,194,194,0);
}
/* Span Tag */
.pointer-events-auto .overflow-hidden span{
 background-color:rgba(31,29,29,0);
}


/* Realtime date */
#realtime-date{
 font-size:14px;
 color:#ffffff;
}

/* Items baseline */
header .mx-auto .items-baseline{
 font-size:14px;
}

/* Span Tag */
.group\/clock .items-center span{
 padding-bottom:0px;
}

/* Items center */
header .group\/clock .items-center{
 font-size:15px;
}

/* Group/clock */
header .mx-auto .group\/clock{
 background-color:rgba(0,0,0,0.81);
}

 #toLanguage:target {
        border-color: #2563eb !important;
        border-width: 2px;
        box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1), 0 4px 6px -2px rgba(37, 99, 235, 0.05);
        scroll-margin-top: 100px;
        animation: border-pulse 2s infinite;
    }

    @keyframes border-pulse {
        0% {
            box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1), 0 4px 6px -2px rgba(37, 99, 235, 0.05), 0 0 0 0 rgba(37, 99, 235, 0.4);
        }

        70% {
            box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1), 0 4px 6px -2px rgba(37, 99, 235, 0.05), 0 0 0 15px rgba(37, 99, 235, 0);
        }

        100% {
            box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1), 0 4px 6px -2px rgba(37, 99, 235, 0.05), 0 0 0 0 rgba(37, 99, 235, 0);
        }
    }


/* Paragraph */
#toLanguage .divide-y p{
 display:inline-block;
 text-align:right;
}

/* Paragraph */
.mx-auto .grid .lg\:col-span-3 #toLanguage .divide-y p{
 width:100% !important;
}

