/*
Template Name: Herozi - Admin & Dashboard Template
Author: SRBThemes
Version: 1.0.0
File: Custom Css File
*/

/* ---------- Tours-themed page background (replaces the flat gray canvas app-wide) ---------- */

body {
    background-color: #eef1f8;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='90' viewBox='0 0 320 90'%3E%3Cpath d='M0 45 C 40 15, 80 75, 120 45 S 200 15, 240 45 S 300 75, 320 45' stroke='%23506fd9' stroke-width='1.4' fill='none' opacity='0.07'/%3E%3Cpath d='M0 65 C 40 35, 80 95, 120 65 S 200 35, 240 65 S 300 95, 320 65' stroke='%23506fd9' stroke-width='1.4' fill='none' opacity='0.045'/%3E%3C/svg%3E"),
        radial-gradient(circle at 10% 6%, rgba(80, 111, 217, .07) 0%, transparent 38%),
        radial-gradient(circle at 92% 96%, rgba(80, 111, 217, .06) 0%, transparent 42%),
        linear-gradient(180deg, #f9fafd 0%, #eef1f8 100%);
    background-repeat: repeat, no-repeat, no-repeat, no-repeat;
    background-attachment: fixed, fixed, fixed, fixed;
}

.app-wrapper { background: transparent; }

/* ---------- Shared "soft/pill" design language (Tours catalog + other CRUD modals) ---------- */

.tf-pill { border-radius: 9999px !important; padding-inline: 1.1rem; }
.tf-pill-sm { border-radius: 9999px !important; padding-inline: .85rem; font-size: .76rem; }

.tc-header { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.tc-title { font-size: 1.55rem; font-weight: 650; color: #1c2333; margin: 0 0 .3rem; letter-spacing: -.01em; }
.tc-subtitle { font-size: .86rem; color: #8a93a6; margin: 0; }

.tc-card { background: #fff; border-radius: 20px; border: 1px solid #edf0f5; box-shadow: oklab(0 0 0 / 0.05) 0px 0px 0px 1px, rgba(0, 0, 0, 0.04) 0px 4px 20px 0px; padding: 1.5rem; }
.tc-card table.datatable thead th { font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #a7afbd; border-bottom: 1px solid #edf0f5 !important; padding: .75rem .85rem; white-space: nowrap; }
.tc-card table.datatable tbody td { padding: .85rem; vertical-align: middle; border-bottom: 1px solid #f4f5f8; font-size: .86rem; }
.tc-card table.datatable tbody tr:hover { background: #fafbfd; }

.tc-card .dataTables_wrapper .dataTables_filter input {
    border-radius: 9999px; border: 1px solid #e3e6ec; padding: .4rem .9rem; font-size: .82rem; margin-left: .5rem;
}
.tc-card .dataTables_wrapper .dataTables_length select {
    border-radius: 9999px; border: 1px solid #e3e6ec; padding: .25rem .7rem; font-size: .82rem;
}
.tc-card .dataTables_wrapper .dataTables_paginate .page-link { border-radius: 9999px !important; margin: 0 .15rem; border: 1px solid #e3e6ec; color: #414855; }
.tc-card .dataTables_wrapper .dataTables_paginate .active .page-link { background: #506fd9; border-color: #506fd9; color: #fff; }
.tc-card .dataTables_wrapper .dataTables_info { font-size: .78rem; color: #a7afbd; }

/* Modal softening - scoped to .modal so full-page forms elsewhere are unaffected */
.modal-content { border-radius: 20px; border: none; box-shadow: oklab(0 0 0 / 0.05) 0px 0px 0px 1px, rgba(0, 0, 0, 0.12) 0px 12px 40px 0px; }
.modal-header, .modal-footer { border-color: #f1f3f7; padding: 1.15rem 1.5rem; }
.modal-body { padding: 1.5rem; }
.modal-title { font-weight: 650; font-size: 1.05rem; color: #1c2333; }
.modal .form-label { font-size: .82rem; font-weight: 550; color: #414855; }
.modal .form-control,
.modal .form-select {
    border-radius: 12px; border-color: #e3e6ec; padding: .6rem .85rem; font-size: .92rem;
}
.modal .form-control:focus,
.modal .form-select:focus {
    border-color: #506fd9; box-shadow: 0 0 0 .18rem rgba(80, 111, 217, .15);
}
