@font-face {
    font-family:  'Basically a Mono',monospace;
    src: url('https://assets.geoadres.pl/w/f/font.woff2') format('woff2');
    font-weight: 600; 
    font-style: normal;
    font-display: swap; 
}

/* Kontener główny widgetu */
.geoadres-widget {
    font-family: sans-serif;
    min-width: 400px;
    max-width: 600px;
    padding: 30px;
    border-radius: 12px;
}

/* Motywy */
.geoadres-widget.light { background: #fdfdfd; color: #08102B; border: 1px solid #eaeaea; }
.geoadres-widget.dark { background: #08102B; color: #ffffff; }

/* Formularz */
.ga-row { display: flex; gap: 13px;     margin: 13px 0;}
.ga-input { 
    flex: 1; padding: 10px; border-radius: 6px; border: 1px solid #ccc; 
    text-transform: uppercase; outline: none; 
}
.dark .ga-input {   
      font-family: 'Basically a Mono',monospace;
    text-align: center;
       font-weight: 600;
    font-size: 22px;
    border-bottom: 0;
    display: table;
    width: auto;
    background: #FFD600;
    color: #08102B;
    letter-spacing: 1px;
    padding: 10px;
}

.dark .ga-input::placeholder {
color: #1f232e;
font-size: 14px;
position: relative;
top: -2px;
     font-family: 'Basically a Mono',monospace;
}
svg{
    display:inline-block;
}
.website{
    display:inline-block;
    margin-left: auto;
    margin-right: 0;
    float:right;
}
.website a{
    color:#fff;
    text-align: right;
    font-size: 11px;
    position: relative;
    top: -3px;
}
.ga-btn { 
    padding: 10px 20px;  border: none; 
    cursor: pointer; font-weight: bold; color: #fff;
}
.ga-btn svg{
    display:block;
}
.dark .ga-btn { text-transform:uppercase; background: #FFD600; color:#08102B; border: 1px solid  #FFD600;   padding: 0 25px;transition: all 0.2s ease-in-out;}
.dark .ga-btn svg{
display: inline-block;margin-top: 5px;position: relative; top: 2px;transition: all 0.2s ease-in-out;
left: 0;
}
.dark .ga-btn span{
display: inline-block;
 position: relative;
    top: 0px;
}
.dark .ga-btn:hover{background: #08102B; color:#FFD600;}
.dark .ga-btn:hover svg{
     transform: scale(1.2);
    left: -8px;
}
.dark .ga-btn:hover svg path{fill: #FFD600}
.dark .ga-btn:hover span{
    position: relative;

}
.ga-btn:disabled { opacity: 0.5; }

/* Wyniki */
.ga-loader { display: none; font-size: 13px; margin-bottom: 10px; }
.ga-fieldset { border: 1px solid #555; border-radius: 6px; padding: 12px; margin-top: 15px; }
.ga-legend { font-size: 11px; text-transform: uppercase; padding: 0 5px; opacity: 0.7; }
.ga-field { font-size: 13px; margin-bottom: 5px; border-bottom: 1px solid rgba(128,128,128,0.2); padding-bottom: 3px; }
.ga-select {color: #000; width: 100%; padding: 10px; margin-top: 10px; border-radius: 4px; }
.ga-error { color: #ff6b6b; margin-top: 10px;margin-bottom: 0; font-size: 14px; }


/* Kontener na selecta, żeby nie dotykał krawędzi outputu */
.ga-output {
    margin-top: 10px;
}

.ga-select {
    width: 100%;
    padding: 10px 15px;
    font-size: 14px;
    font-family: inherit;
    border: 2px solid #08102b;
    border-radius: 0;
    background-color: #ffffff;
    color: #08102b;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease;
    
    /* Własna strzałka */
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%2308102b' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
}

.ga-select:hover {
    border-color: #ffd325;
}

.ga-select:focus {
    border-color: #ffd325;
    box-shadow: 0 0 0 3px rgba(255, 211, 37, 0.2);
}

/* Styl dla opcji - uwaga: ograniczone możliwości personalizacji */
.ga-select option {
    padding: 10px;
    background: #fff;
    color: #08102b;
}

@media screen and (max-width: 500px){
    .geoadres-widget.dark{
            max-width: 100%;
    min-width: 0;
    }
    .ga-row{
        display:block;

    }
    .dark .ga-input{
        width: 100%;
    }
     .ga-row .ga-btn{
        display: block;
    margin: auto;
    margin-top: 20px;
     }
}