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

:root {
    --tm-primary: #062f52;
    --tm-primary-dark: #042542;
    --tm-secondary: #ff5a16;
    --tm-secondary-dark: #e94a08;
    --tm-dark: #102f49;
    --tm-text: #536577;
    --tm-light: #f5f7fa;
    --tm-white: #ffffff;
    --tm-border: #dce4eb;
    --tm-shadow: 0 10px 30px rgba(6, 47, 82, .10);
    --tm-radius: 10px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0 !important;
    padding: 24px 14px !important;
    background: linear-gradient(180deg, #eef3f7 0, var(--tm-light) 160px) !important;
    color: var(--tm-text) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    overflow-x: hidden;
    border-top: 5px solid var(--tm-primary);
}
body:before {
    content: 'TopMaistori.eu';
    display: block;
    width: min(1080px, 100%);
    margin: 0 auto 14px;
    padding: 16px 20px;
    color: #fff;
    background: var(--tm-primary);
    border-bottom: 3px solid var(--tm-secondary);
    border-radius: 9px;
    font: 700 clamp(20px, 4vw, 27px)/1.2 'Roboto', sans-serif;
    box-shadow: 0 8px 24px rgba(6,47,82,.13);
}

h1,h2,h3,h4,h5,h6,.page-header h1,.wrapped-text h2 {
    font-family:'Roboto',sans-serif !important;
    color:var(--tm-dark) !important;
    font-weight:700 !important;
    line-height:1.25 !important;
}
h1,.page-header h1 { font-size:clamp(28px,5vw,42px) !important; }
h2 { font-size:clamp(25px,4vw,34px) !important; }
h3 { font-size:clamp(21px,3vw,27px) !important; }
h4 { font-size:20px !important; }
p,li,label,input,select,textarea,button,.btn,td,th { font-family:'Inter',sans-serif !important; }
a { color:var(--tm-primary); }
a:hover { color:var(--tm-secondary); }

.container {
    width:100% !important;
    max-width:1080px !important;
    margin:0 auto !important;
    padding:28px !important;
    background:var(--tm-white) !important;
    border:1px solid rgba(6,47,82,.07) !important;
    border-radius:var(--tm-radius) !important;
    box-shadow:var(--tm-shadow) !important;
}
.page-header {
    margin:0 0 24px !important;
    padding:0 0 18px !important;
    border:0 !important;
    border-bottom:3px solid var(--tm-secondary) !important;
}
.wrapper {
    width:100% !important;
    max-width:480px !important;
    margin:30px auto !important;
    padding:30px !important;
    background:var(--tm-white) !important;
    border:1px solid rgba(6,47,82,.08) !important;
    border-radius:var(--tm-radius) !important;
    box-shadow:var(--tm-shadow) !important;
    text-align:left !important;
}
.wrapper h1,.wrapper h2,.wrapper h3 { text-align:center; }
.form-group { margin-bottom:18px !important; }
label { display:block; margin-bottom:7px !important; color:var(--tm-dark) !important; font-weight:600 !important; }

.form-control,input[type='text'],input[type='email'],input[type='password'],input[type='tel'],input[type='number'],select,textarea {
    width:100% !important;
    min-height:48px !important;
    padding:11px 13px !important;
    border:1px solid var(--tm-border) !important;
    border-radius:7px !important;
    background:var(--tm-white) !important;
    color:var(--tm-dark) !important;
    font-size:16px !important;
    box-shadow:none !important;
    transition:border-color .2s ease,box-shadow .2s ease !important;
}
textarea { min-height:120px !important; resize:vertical; }
.form-control:focus,input:focus,select:focus,textarea:focus {
    border-color:var(--tm-secondary) !important;
    outline:0 !important;
    box-shadow:0 0 0 3px rgba(255,90,22,.12) !important;
}

.btn,.btn-custom,button,input[type='submit'],input[type='button'] {
    min-height:46px;
    padding:11px 20px !important;
    border:1px solid transparent !important;
    border-radius:6px !important;
    font-size:15px !important;
    font-weight:700 !important;
    line-height:1.35 !important;
    text-decoration:none !important;
    transition:background-color .2s ease,border-color .2s ease,transform .2s ease !important;
    white-space:normal;
}
.btn:hover,.btn-custom:hover,button:hover,input[type='submit']:hover { transform:translateY(-1px); }
.btn-primary,.btn-warning,.btn-success,.btn-custom,button:not(.btn-close),input[type='submit'] {
    background:var(--tm-secondary) !important;
    border-color:var(--tm-secondary) !important;
    color:#fff !important;
}
.btn-primary:hover,.btn-warning:hover,.btn-success:hover,.btn-custom:hover,button:not(.btn-close):hover,input[type='submit']:hover {
    background:var(--tm-secondary-dark) !important;
    border-color:var(--tm-secondary-dark) !important;
    color:#fff !important;
}
.btn-secondary,.btn-danger,.btn-admin {
    background:var(--tm-primary) !important;
    border-color:var(--tm-primary) !important;
    color:#fff !important;
}
.btn-secondary:hover,.btn-danger:hover,.btn-admin:hover { background:var(--tm-primary-dark) !important; border-color:var(--tm-primary-dark) !important; }
.btn-default,.btn-link { background:#fff !important; border-color:var(--tm-primary) !important; color:var(--tm-primary) !important; }
.btn-link:hover,.btn-default:hover { background:rgba(6,47,82,.06) !important; color:var(--tm-secondary) !important; }

.help-block,.text-danger { color:#b42318 !important; }
.alert { border-radius:8px !important; border-width:1px !important; padding:13px 15px !important; }
.profile-container,.master-card,.card,.panel {
    background:#fff !important;
    border:1px solid var(--tm-border) !important;
    border-radius:var(--tm-radius) !important;
    box-shadow:0 5px 18px rgba(6,47,82,.07) !important;
}
.profile-container { padding:22px !important; margin-bottom:20px !important; }
.master-card { overflow:hidden; margin-bottom:16px; padding:15px; }
.profile-img { width:84px !important; height:84px !important; border-radius:50% !important; object-fit:cover !important; border:3px solid rgba(255,90,22,.20) !important; }
.contact-icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; margin-top:10px; border-radius:50%; background:var(--tm-primary); color:#fff !important; font-size:18px; text-decoration:none !important; }

.table,.table-custom { width:100% !important; margin:0 !important; border-collapse:separate !important; border-spacing:0 !important; background:transparent !important; }
.table th,.table-custom th { color:#fff !important; font-weight:700 !important; background:var(--tm-primary) !important; }
.table td,.table th,.table-custom td,.table-custom th { padding:12px !important; border-color:var(--tm-border) !important; vertical-align:middle !important; }
.table-striped>tbody>tr:nth-of-type(odd) { background:#f7f9fb !important; }
.pagination { display:flex !important; justify-content:center !important; flex-wrap:wrap; gap:6px; padding:0 !important; }
.pagination>li>a,.pagination li a { color:var(--tm-primary) !important; border:1px solid var(--tm-border) !important; border-radius:5px !important; margin:0 !important; }
.pagination>.active>a,.pagination li.active a { background:var(--tm-secondary) !important; border-color:var(--tm-secondary) !important; color:#fff !important; }

.navbar,.nav-bar { border-color:transparent !important; }
.navbar-default { background:var(--tm-primary) !important; border:0 !important; }
.navbar-default .navbar-brand,.navbar-default .navbar-nav>li>a { color:#fff !important; }
.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>.active>a { color:#fff !important; background:rgba(255,255,255,.08) !important; border-bottom:3px solid var(--tm-secondary); }
.navbar-toggle { border-color:rgba(255,255,255,.5) !important; }
.navbar-toggle .icon-bar { background:#fff !important; }

img { max-width:100%; height:auto; }

@media (max-width:767px) {
    body { padding:12px 8px !important; font-size:15px !important; }
    body:before { border-radius:7px; margin-bottom:10px; padding:14px 15px; }
    .container,.wrapper { padding:18px 14px !important; border-radius:8px !important; }
    .wrapper { margin:14px auto !important; }
    .btn,.btn-custom,button,input[type='submit'],input[type='button'] { width:100% !important; margin-bottom:8px !important; min-height:48px; }
    .table-responsive { border:0 !important; }
    .table td,.table th,.table-custom td,.table-custom th { padding:9px 7px !important; font-size:13px !important; }
    .profile-img { width:68px !important; height:68px !important; }
    .pagination>li>a,.pagination li a { padding:7px 10px !important; }
    input,select,textarea { font-size:16px !important; }
}

@media (max-width:480px) {
    h1,.page-header h1 { font-size:27px !important; }
    h2 { font-size:23px !important; }
    .container,.wrapper { padding:15px 11px !important; }
}