@charset "utf-8";
/* @import removed: PC CSS is loaded by the included PC skin file. */

/* Mobile Responsive Overrides */
#bo_list { min-width: 0 !important; }
/* Mobile Responsive Overrides - Flexbox Layout */
#bo_list { min-width: 0 !important; }
.tbl_head01 { border-top: 2px solid #333; }
.tbl_head01 table { width: 100% !important; display: block !important; border: 0 !important; }
.tbl_head01 thead { display: none !important; } /* Hide Header */
.tbl_head01 tbody { display: block !important; }
.tbl_head01 tr { display: flex !important; width: 100% !important; border-bottom: 1px solid #eee; padding: 10px 5px; box-sizing: border-box; align-items: center; } /* Changed to center alignment */
.tbl_head01 td { display: block !important; border: 0 !important; padding: 0 !important; }

/* Hide non-essential columns - Unhide num for user request */
.th_name, .td_name, #bo_list .td_name,
.th_date, .td_datetime, #bo_list .td_datetime { display: none !important; }

/* 1. Number Column ("1") - Reduce padding/width */
.td_num:first-of-type { 
    display: block !important; 
    width: 25px !important; 
    text-align: center; 
    margin-right: 5px; 
    color: #666;
    font-size: 13px;
}

/* 2. Hit Column ("29") - Reduce right padding */
/* Note: list.skin.php uses td_num for Hit as well */
.td_num:last-of-type { 
    display: block !important; 
    width: 30px !important; 
    text-align: right; 
    padding-right: 0 !important; /* Minimized right padding */
    margin-left: 5px;
    color: #888;
    font-size: 11px;
}

/* Checkbox Column */
.th_chk, .td_chk { width: 30px !important; margin-right: 5px; align-self: center; }

/* Main Content Column (Subject) */
.th_subject, .td_subject { flex: 1 !important; width: auto !important; }

/* Title Link - Inline to allow tags to flow next to it */
.td_subject a { 
    font-size: 16px !important; 
    font-weight: bold; 
    display: inline !important; 
    line-height: 1.6; 
    margin-right: 5px;
    color: #000;
}

/* List Item Tags - Visual Fixes */
.td_subject span { 
    display: inline-block !important; 
    white-space: nowrap !important;
    margin: 2px 2px 0 0 !important; 
    padding: 2px 6px !important;
    font-size: 12px !important;
    background: #f4f4f4;
    border-radius: 4px;
    color: #555;
    vertical-align: middle;
}

/* [FIX] Write Button Visibility & Layout */
.bo_fx { 
    width: 100% !important; 
    float: none !important; 
    display: flex !important;
    flex-direction: column !important; 
    align-items: center !important; 
    height: auto !important; 
    overflow: visible !important; 
    margin-bottom: 20px !important; 
    padding: 10px 0 !important; 
    border-bottom: 1px solid #ddd !important;
    box-sizing: border-box !important;
}

#bo_list_total { 
    width: 94% !important; 
    display: block !important; 
    margin: 10px !important; /* Match Basic skin exactly (10px all around) */
    padding: 10px !important; 
    line-height: 1.4 !important; 
    text-align: center !important; 
    background: #e3e7ec !important; 
    color: #8b8b8b !important; 
    border-radius: 3px !important; /* Match Basic skin exactly */
    font-size: 13px !important;
}

/* Hide original inline write button */
.btn_bo_user { display: none !important; }

/* FAB (Floating Action Button) Styles */
.btn_bo_write_fab {
    position: fixed !important;
    bottom: 65px !important; /* Adjusted to 65px as requested */
    right: 15px !important;  /* Adjusted to 15px as requested */
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    background: #3a8afd !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important;
    z-index: 1000 !important;
    text-align: center !important;
    line-height: 50px !important;
    color: #fff !important;
    font-size: 20px !important;
    display: block !important;
    border: 0 !important;
    outline: 0 !important;
}
.btn_bo_write_fab:hover, .btn_bo_write_fab:focus {
    background: #2c7ce6 !important;
    color: #fff !important;
}
.btn_bo_write_fab i {
    line-height: 50px !important;
    vertical-align: middle !important;
}
/* Filter Search Area Optimization */

.filter_search_wrap { padding: 15px 10px !important; box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; }
/* removed: was forcing all accordion content divs open on mobile */
.filter_categories strong { font-size: 14px !important; display: block; margin-bottom: 5px; }
.filter_tag { 
    display: inline-block !important;
    padding: 6px 10px !important; 
    font-size: 13px !important; 
    white-space: nowrap !important; /* Keep tag text on one line */
    height: auto !important; 
    margin: 0 4px 6px 0 !important;
    width: auto !important;
}

/* Fix Reset/Search Links/Buttons squashing */
.filter_search_wrap button, 
.filter_search_wrap .btn {
    width: auto !important;
    display: inline-block !important;
    white-space: nowrap !important; /* Prevent vertical text wrapping */
    padding: 8px 15px !important;
    margin: 0 2px !important;
    box-sizing: border-box !important;
    height: auto !important;
}



/* [NEW] Unified Tag Option Style (Global) */
.tour_tag_option {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: 12px !important;       /* Reduced from ~14px */
    padding: 4px 10px !important;      /* Reduced padding */
    border: 1px solid #ddd !important;
    border-radius: 15px !important;    /* Rounded pill shape */
    background: #fff !important;
    color: #555 !important;
    cursor: pointer;
    transition: all 0.2s;
    margin: 2px !important;
    white-space: nowrap !important;
    height: 28px !important; /* Fixed height for consistency */
    line-height: normal !important;
}

/* Active/Selected State */
.tour_tag_option.active, 
.tour_tag_option.checked,
.tour_tag_option input:checked + span,
/* For list.skin.php where class is on label and checkbox is inside */
.tour_tag_option:has(input:checked) {
    background: #007bff !important;
    color: #fff !important;
    border-color: #007bff !important;
}

/* Hover State */
.tour_tag_option:hover {
    border-color: #007bff !important;
    color: #007bff !important;
}
.tour_tag_option:has(input:checked):hover {
    color: #fff !important;
}