@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

/* ==========================================================================
   SELIDA EGGRAFIS PELATI (pelatis-create.php) - nea sxediasi
   --------------------------------------------------------------------------
   PROSOXI STIN EIDIKOTITA (specificity):
   To palio css/pelatis-create.css (1100 grammes) exei DEKADES kanones me id
   gia ta idia akrivos pedia - #eponimia_input, #poli_input, #map_canvas,
   #save_input_container k.lp. Enas kanonas me id (1,0,0) nikaei opoiondipote
   me klaseis, opote to na fortoso afto to arxeio teleftaio DEN arkei.

   Gi afto oli i nea selida einai tyligmeni se #reg_page kai KATHE kanonas edo
   ksekinaei apo afto: to "#reg_page .reg_input input" einai (1,2,1) kai nikaei
   to "#eponimia_input" (1,0,0) xoris kanena !important.

   To xroma tou pelati (b2b_colors) erxetai INLINE apo to PHP san --reg_accent.
   Kathe pelatis exei diko tou, opote den grafetai pouthena stathero edo -
   mono to fallback gia tin periptosi pou leipei.
   ========================================================================== */

#reg_page{
    --reg_ink:#12213f;          /* skouro keimeno */
    --reg_ink_soft:#7d8ba1;     /* deftereuon keimeno */
    --reg_line:#e2e6ec;         /* perigrammata */
    --reg_field_bg:#fff;
    --reg_icon:#a9b7c9;         /* eikonidia mesa sta pedia */
    --reg_req:#e03131;          /* to asterisko ton ypoxreotikon */

    box-sizing:border-box;
    width:100%;
    max-width:1180px;
    margin:0 auto;
    padding:18px 24px 60px;
    font-family:'Manrope','Lato','Segoe UI',Arial,sans-serif;
    color:var(--reg_ink);
    text-align:left;
}

#reg_page *,
#reg_page *::before,
#reg_page *::after{
    box-sizing:border-box;
}


/* --- 1) Psixoula: diadromi, titlos, ypotitlos ---------------------------- */
#reg_page .reg_crumbs{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:12.5px;
    font-weight:600;
    color:var(--reg_ink_soft);
    margin-bottom:10px;
}
#reg_page .reg_crumbs a{
    color:var(--reg_ink_soft);
    text-decoration:none;
}
#reg_page .reg_crumbs a:hover{
    color:var(--reg_accent,#1b6fc4);
    text-decoration:none;
}
#reg_page .reg_crumbs_sep{
    color:#c3cbd6;
}
#reg_page .reg_crumbs_cur{
    color:var(--reg_ink);
}

#reg_page .reg_title{
    margin:0 0 6px;
    font-size:34px;
    font-weight:800;
    line-height:1.15;
    letter-spacing:-.4px;
    color:var(--reg_ink);
}
#reg_page .reg_sub{
    margin:0 0 20px;
    font-size:14.5px;
    font-weight:500;
    line-height:1.5;
    color:var(--reg_ink_soft);
}


/* --- 2) I karta ---------------------------------------------------------- */
#reg_page .reg_card{
    background:#fff;
    border:1px solid #eceff4;
    border-radius:14px;
    box-shadow:0 2px 14px rgba(16,24,40,.06);
    padding:26px 28px 24px;
}

#reg_page .reg_card_head{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:22px;
}
#reg_page .reg_card_icon{
    flex:0 0 auto;
    width:46px;
    height:46px;
    border-radius:50%;
    background:#eef4fb;
    color:var(--reg_accent,#1b6fc4);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:19px;
}
#reg_page .reg_card_title{
    font-size:18.5px;
    font-weight:800;
    line-height:1.25;
}
#reg_page .reg_card_sub{
    font-size:12.5px;
    font-weight:500;
    color:var(--reg_ink_soft);
    line-height:1.4;
    margin-top:2px;
}


/* --- 3) To plegma ton pedion --------------------------------------------
   Dyo stiles, me ti seira pou tis diavazeis: Eponimia | Diefthinsi,
   A.F.M. | Poli, k.o.k. - akrivos opos i maketa. Se steni othoni ginetai
   mia stili kai i seira menei i idia (zeugari-zeugari), pou diavazetai
   kanonika. ------------------------------------------------------------- */
#reg_page .reg_grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px 24px;
}
#reg_page .reg_field_full{
    grid-column:1 / -1;
}

#reg_page .reg_field label{
    display:block;
    margin:0 0 7px;
    font-size:13.5px;
    font-weight:700;
    color:var(--reg_ink);
    line-height:1.2;
}
#reg_page .reg_req{
    color:var(--reg_req);
    font-weight:700;
}


/* --- 4) Ta pedia --------------------------------------------------------- */
#reg_page .reg_input{
    position:relative;
    display:block;
    width:100%;
}
#reg_page .reg_input > .reg_ico{
    position:absolute;
    top:0;
    left:0;
    width:44px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--reg_icon);
    font-size:14px;
    pointer-events:none;   /* to klik na paei sto pedio apo kato */
}

#reg_page .reg_input input,
#reg_page .reg_input textarea{
    display:block;
    float:none;
    width:100%;
    min-width:0;
    height:48px;
    margin:0;
    padding:0 14px 0 44px;
    background:var(--reg_field_bg);
    border:1px solid var(--reg_line);
    border-radius:10px;
    color:var(--reg_ink);
    font-family:inherit;
    font-size:14px;
    font-weight:500;
    line-height:normal;
    outline:none;
    box-shadow:none;
    transition:border-color .15s ease, box-shadow .15s ease;
}
#reg_page .reg_input textarea{
    height:auto;
    min-height:112px;
    padding:13px 14px 13px 44px;
    resize:vertical;
    line-height:1.5;
}
#reg_page .reg_input textarea + .reg_ico,
#reg_page .reg_input > .reg_ico.reg_ico_top{
    height:46px;   /* sto textarea to eikonidio paei pano-aristera */
}

#reg_page .reg_input input::placeholder,
#reg_page .reg_input textarea::placeholder{
    color:#9aa7b8;
    font-style:normal;
    font-weight:500;
    opacity:1;
}

#reg_page .reg_input input:focus,
#reg_page .reg_input textarea:focus{
    border-color:var(--reg_accent,#1b6fc4);
    box-shadow:0 0 0 3px rgba(27,111,196,.12);
}

/* To JS vafei to perigramma kokkino otan leipei i otan yparxei idi to
   AFM / email. Kratame ti symperifora, apla ti deixnoume pio kathara. */
#reg_page .reg_input input[style*="red"]{
    border-color:var(--reg_req) !important;
    box-shadow:0 0 0 3px rgba(224,49,49,.10);
}


/* --- 5) O xartis ---------------------------------------------------------
   DEN yparxei sti maketa - einai diki mas leitourgia kai menei. To
   #txtautocomplete (Google Places) gemizei ta krymmena lat/lon kai i pineza
   metakineitai, opote o xartis anikei dipla sti diefthinsi. Ton vazoume se
   oli ti grammi, kato apo ta pedia, gia na min stenepsei o kanenas apo tous
   dyo se mikres othones. ------------------------------------------------- */
#reg_page .reg_map_block{
    grid-column:1 / -1;
    margin-top:2px;
}
#reg_page .reg_map_head{
    display:flex;
    align-items:center;
    gap:8px;
    margin:0 0 7px;
    font-size:13.5px;
    font-weight:700;
}
#reg_page .reg_map_head i{
    color:var(--reg_accent,#1b6fc4);
    font-size:14px;
}
#reg_page .reg_map_hint{
    margin:-3px 0 8px;
    font-size:12px;
    font-weight:500;
    color:var(--reg_ink_soft);
}
#reg_page #map_canvas{
    width:100%;
    height:300px;
    margin:0;
    border:1px solid var(--reg_line);
    border-radius:10px;
    overflow:hidden;
}


/* --- 6) I grammi ton energeion ------------------------------------------ */
#reg_page .reg_actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
    margin-top:24px;
    padding-top:20px;
    border-top:1px solid #eef1f5;
}

#reg_page .reg_back{
    display:inline-flex;
    align-items:center;
    gap:9px;
    font-size:13.5px;
    font-weight:600;
    color:var(--reg_ink_soft);
    text-decoration:none;
}
#reg_page .reg_back:hover{
    color:var(--reg_ink);
    text-decoration:none;
}
#reg_page .reg_back b{
    color:var(--reg_accent,#1b6fc4);
    font-weight:700;
}

/* To id menei os exei: to JS pianetai apo to #save_input_container */
#reg_page #save_input_container{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:auto;
    height:48px;
    margin:0;
    padding:0 26px;
    float:none;
    position:static;
    background:var(--reg_accent,#1b6fc4);
    border:none;
    border-radius:10px;
    color:#fff;
    font-family:inherit;
    font-size:15px;
    font-weight:700;
    line-height:normal;
    text-align:center;
    cursor:pointer;
    box-shadow:0 2px 10px rgba(16,24,40,.12);
    transition:filter .15s ease, box-shadow .15s ease;
}
#reg_page #save_input_container:hover{
    filter:brightness(.93);
    box-shadow:0 3px 14px rgba(16,24,40,.18);
}
#reg_page #save_input_container i{
    font-size:13px;
}


/* --- 7) Responsive -------------------------------------------------------
   Tria skalopatia:
     <=1024  i karta pianei oli tin othoni me mikrotero perithorio
     <=820   mikrotera perithoria stin karta (o xartis xamiloteros)
     <=700   mia stili - dyo stiles theloun ~690px, opote mexri ekei antexoun
             (se tablet 768 menoun dyo, pou einai kai to sosto gia forma)
     <=560   to koumpi piani oli ti grammi kai to keimeno mikrainei
   -------------------------------------------------------------------- */
@media (max-width:1024px){
    #reg_page{
        padding:14px 16px 48px;
    }
    #reg_page .reg_title{
        font-size:30px;
    }
}

@media (max-width:820px){
    #reg_page .reg_card{
        padding:22px 18px 20px;
    }
    #reg_page #map_canvas{
        height:240px;
    }
}

@media (max-width:700px){
    #reg_page .reg_grid{
        grid-template-columns:minmax(0,1fr);
        gap:14px;
    }
}

@media (max-width:560px){
    #reg_page{
        padding:12px 14px 40px;
    }
    #reg_page .reg_title{
        font-size:25px;
    }
    #reg_page .reg_sub{
        font-size:13.5px;
        margin-bottom:16px;
    }
    #reg_page .reg_card{
        padding:18px 14px 16px;
        border-radius:12px;
    }
    #reg_page .reg_card_head{
        gap:11px;
        margin-bottom:18px;
    }
    #reg_page .reg_card_icon{
        width:40px;
        height:40px;
        font-size:17px;
    }
    #reg_page .reg_card_title{
        font-size:17px;
    }

    /* Se kinito to koumpi piani oli ti grammi kai paei PANO apo to
       "exete idi logariasmo" - i kyria energeia protі. */
    #reg_page .reg_actions{
        flex-direction:column-reverse;
        align-items:stretch;
        gap:14px;
    }
    #reg_page #save_input_container{
        width:100%;
    }
    #reg_page .reg_back{
        justify-content:center;
    }
    #reg_page #map_canvas{
        height:210px;
    }
}
